Open yangup opened 2 years ago
<template> <tree-select v-model="dataModel" :multiple="multiple" :options="optionsData"/> </template> <script> // import the component import TreeSelect from '@riophae/vue-treeselect' // import the styles import '@riophae/vue-treeselect/dist/vue-treeselect.css' import { isZero } from "@/utils/validate"; export default { name: 'SelectTree', components: { TreeSelect, }, props: { value: { type: String, default: () => { return null }, }, /* 多选 */ multiple: { type: Boolean, required: false, default: false, }, /* 树形结构的数据 */ options: { type: Array, default: () => { return [] }, }, }, data() { return { dataModel: '', optionsData: [], } }, watch: { dataModel(val) { this.$emit("input", val); }, }, mounted() { }, created() { this.init() }, methods: { init() { this.dataModel = this.value this.dataModel = '' let cloneData = this.options let result = cloneData.filter(father => { // 循环所有项,并添加children属性 let branchArr = cloneData.filter(child => father.id === child.parentId) // 返回每一项的子级数组 branchArr.length > 0 ? (father.children = branchArr) : '' // 给父级添加一个children属性,并赋值 return isZero(father.parentId) // 返回第一层 }) result.unshift({ id: 0, parentId: 0, label: 'ROOT' }) this.optionsData = [{ id: 'a', label: 'a', children: [{ id: 'aa', label: 'aa', }, { id: 'ab', label: 'ab', }], }, { id: 'b', label: 'b', }, { id: 'c', label: 'c', }] console.log(this.dataModel) console.log(this.optionsData) }, }, } </script>
错误 信息 :
vue.runtime.esm.js:620 [Vue warn]: Error in getter for watcher "internalValue": "TypeError: this.forest.selectedNodeIds.filter is not a function" found in ---> <VueTreeselect> at src/components/Treeselect.vue <SelectTree> at src/components/SelectTree/index.vue <ElFormItem> at packages/form/src/form-item.vue <ElForm> at packages/form/src/form.vue <ElDialog> at packages/dialog/src/component.vue <PrivilegeOperate> at src/components/Views/PrivilegeOperate.vue <Privilege> at src/views/system/privilege.vue <AppMain> at src/layout/components/AppMain.vue <Layout> at src/layout/index.vue <App> at src/App.vue <Root> warn @ vue.runtime.esm.js:620 logError @ vue.runtime.esm.js:1892 globalHandleError @ vue.runtime.esm.js:1887 handleError @ vue.runtime.esm.js:1847 get @ vue.runtime.esm.js:4492 Watcher @ vue.runtime.esm.js:4478 Vue.$watch @ vue.runtime.esm.js:4953 createWatcher @ vue.runtime.esm.js:4913 initWatch @ vue.runtime.esm.js:4895 initState @ vue.runtime.esm.js:4655 Vue._init @ vue.runtime.esm.js:5010 VueComponent @ vue.runtime.esm.js:5158 createComponentInstanceForVnode @ vue.runtime.esm.js:3301 init @ vue.runtime.esm.js:3130 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 updateChildren @ vue.runtime.esm.js:6250 patchVnode @ vue.runtime.esm.js:6353 updateChildren @ vue.runtime.esm.js:6227 patchVnode @ vue.runtime.esm.js:6353 patch @ vue.runtime.esm.js:6516 Vue._update @ vue.runtime.esm.js:3957 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 run @ vue.runtime.esm.js:4564 flushSchedulerQueue @ vue.runtime.esm.js:4320 eval @ vue.runtime.esm.js:1988 flushCallbacks @ vue.runtime.esm.js:1914 Promise.then (async) timerFunc @ vue.runtime.esm.js:1941 nextTick @ vue.runtime.esm.js:1998 queueWatcher @ vue.runtime.esm.js:4412 update @ vue.runtime.esm.js:4554 notify @ vue.runtime.esm.js:731 reactiveSetter @ vue.runtime.esm.js:1056 proxySetter @ vue.runtime.esm.js:4638 _callee2$ @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:388 tryCatch @ runtime.js:63 invoke @ runtime.js:294 eval @ runtime.js:119 asyncGeneratorStep @ asyncToGenerator.js:5 _next @ asyncToGenerator.js:27 Promise.then (async) asyncGeneratorStep @ asyncToGenerator.js:15 _next @ asyncToGenerator.js:27 eval @ asyncToGenerator.js:34 eval @ asyncToGenerator.js:23 open @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:396 handleAddUpdate @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=script&lang=js&:264 click @ cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"3f5280c5-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=template&id=65104a6b&:235 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 invokeWithErrorHandling @ vue.runtime.esm.js:1862 Vue.$emit @ vue.runtime.esm.js:3897 handleClick @ element-ui.common.js:9457 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 original._wrapper @ vue.runtime.esm.js:6951 Show 36 more frames vue.runtime.esm.js:1896 TypeError: this.forest.selectedNodeIds.filter is not a function at VueComponent.internalValue (vue-treeselect.cjs.js:888:53) at Watcher.get (vue.runtime.esm.js:4489:25) at Watcher.evaluate (vue.runtime.esm.js:4591:21) at VueComponent.computedGetter [as internalValue] (vue.runtime.esm.js:4843:17) at VueComponent.eval (vue.runtime.esm.js:504:16) at Watcher.get (vue.runtime.esm.js:4489:25) at new Watcher (vue.runtime.esm.js:4478:12) at VueComponent.Vue.$watch (vue.runtime.esm.js:4953:19) at createWatcher (vue.runtime.esm.js:4913:13) at initWatch (vue.runtime.esm.js:4895:7) logError @ vue.runtime.esm.js:1896 globalHandleError @ vue.runtime.esm.js:1887 handleError @ vue.runtime.esm.js:1847 get @ vue.runtime.esm.js:4492 Watcher @ vue.runtime.esm.js:4478 Vue.$watch @ vue.runtime.esm.js:4953 createWatcher @ vue.runtime.esm.js:4913 initWatch @ vue.runtime.esm.js:4895 initState @ vue.runtime.esm.js:4655 Vue._init @ vue.runtime.esm.js:5010 VueComponent @ vue.runtime.esm.js:5158 createComponentInstanceForVnode @ vue.runtime.esm.js:3301 init @ vue.runtime.esm.js:3130 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 updateChildren @ vue.runtime.esm.js:6250 patchVnode @ vue.runtime.esm.js:6353 updateChildren @ vue.runtime.esm.js:6227 patchVnode @ vue.runtime.esm.js:6353 patch @ vue.runtime.esm.js:6516 Vue._update @ vue.runtime.esm.js:3957 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 run @ vue.runtime.esm.js:4564 flushSchedulerQueue @ vue.runtime.esm.js:4320 eval @ vue.runtime.esm.js:1988 flushCallbacks @ vue.runtime.esm.js:1914 Promise.then (async) timerFunc @ vue.runtime.esm.js:1941 nextTick @ vue.runtime.esm.js:1998 queueWatcher @ vue.runtime.esm.js:4412 update @ vue.runtime.esm.js:4554 notify @ vue.runtime.esm.js:731 reactiveSetter @ vue.runtime.esm.js:1056 proxySetter @ vue.runtime.esm.js:4638 _callee2$ @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:388 tryCatch @ runtime.js:63 invoke @ runtime.js:294 eval @ runtime.js:119 asyncGeneratorStep @ asyncToGenerator.js:5 _next @ asyncToGenerator.js:27 Promise.then (async) asyncGeneratorStep @ asyncToGenerator.js:15 _next @ asyncToGenerator.js:27 eval @ asyncToGenerator.js:34 eval @ asyncToGenerator.js:23 open @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:396 handleAddUpdate @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=script&lang=js&:264 click @ cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"3f5280c5-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=template&id=65104a6b&:235 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 invokeWithErrorHandling @ vue.runtime.esm.js:1862 Vue.$emit @ vue.runtime.esm.js:3897 handleClick @ element-ui.common.js:9457 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 original._wrapper @ vue.runtime.esm.js:6951 Show 35 more frames vue.runtime.esm.js:620 [Vue warn]: Error in callback for immediate watcher "options": "TypeError: this.forest.selectedNodeIds.forEach is not a function" found in ---> <VueTreeselect> at src/components/Treeselect.vue <SelectTree> at src/components/SelectTree/index.vue <ElFormItem> at packages/form/src/form-item.vue <ElForm> at packages/form/src/form.vue <ElDialog> at packages/dialog/src/component.vue <PrivilegeOperate> at src/components/Views/PrivilegeOperate.vue <Privilege> at src/views/system/privilege.vue <AppMain> at src/layout/components/AppMain.vue <Layout> at src/layout/index.vue <App> at src/App.vue <Root> warn @ vue.runtime.esm.js:620 logError @ vue.runtime.esm.js:1892 globalHandleError @ vue.runtime.esm.js:1887 handleError @ vue.runtime.esm.js:1847 invokeWithErrorHandling @ vue.runtime.esm.js:1870 Vue.$watch @ vue.runtime.esm.js:4957 createWatcher @ vue.runtime.esm.js:4913 initWatch @ vue.runtime.esm.js:4895 initState @ vue.runtime.esm.js:4655 Vue._init @ vue.runtime.esm.js:5010 VueComponent @ vue.runtime.esm.js:5158 createComponentInstanceForVnode @ vue.runtime.esm.js:3301 init @ vue.runtime.esm.js:3130 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 updateChildren @ vue.runtime.esm.js:6250 patchVnode @ vue.runtime.esm.js:6353 updateChildren @ vue.runtime.esm.js:6227 patchVnode @ vue.runtime.esm.js:6353 patch @ vue.runtime.esm.js:6516 Vue._update @ vue.runtime.esm.js:3957 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 run @ vue.runtime.esm.js:4564 flushSchedulerQueue @ vue.runtime.esm.js:4320 eval @ vue.runtime.esm.js:1988 flushCallbacks @ vue.runtime.esm.js:1914 Promise.then (async) timerFunc @ vue.runtime.esm.js:1941 nextTick @ vue.runtime.esm.js:1998 queueWatcher @ vue.runtime.esm.js:4412 update @ vue.runtime.esm.js:4554 notify @ vue.runtime.esm.js:731 reactiveSetter @ vue.runtime.esm.js:1056 proxySetter @ vue.runtime.esm.js:4638 _callee2$ @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:388 tryCatch @ runtime.js:63 invoke @ runtime.js:294 eval @ runtime.js:119 asyncGeneratorStep @ asyncToGenerator.js:5 _next @ asyncToGenerator.js:27 Promise.then (async) asyncGeneratorStep @ asyncToGenerator.js:15 _next @ asyncToGenerator.js:27 eval @ asyncToGenerator.js:34 eval @ asyncToGenerator.js:23 open @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:396 handleAddUpdate @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=script&lang=js&:264 click @ cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"3f5280c5-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=template&id=65104a6b&:235 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 invokeWithErrorHandling @ vue.runtime.esm.js:1862 Vue.$emit @ vue.runtime.esm.js:3897 handleClick @ element-ui.common.js:9457 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 original._wrapper @ vue.runtime.esm.js:6951 Show 35 more frames vue.runtime.esm.js:1896 TypeError: this.forest.selectedNodeIds.forEach is not a function at VueComponent.keepDataOfSelectedNodes (vue-treeselect.cjs.js:1198:35) at VueComponent.initialize (vue-treeselect.cjs.js:1058:14) at VueComponent.handler (vue-treeselect.cjs.js:991:14) at invokeWithErrorHandling (vue.runtime.esm.js:1862:26) at VueComponent.Vue.$watch (vue.runtime.esm.js:4957:7) at createWatcher (vue.runtime.esm.js:4913:13) at initWatch (vue.runtime.esm.js:4895:7) at initState (vue.runtime.esm.js:4655:5) at VueComponent.Vue._init (vue.runtime.esm.js:5010:5) at new VueComponent (vue.runtime.esm.js:5158:12) logError @ vue.runtime.esm.js:1896 globalHandleError @ vue.runtime.esm.js:1887 handleError @ vue.runtime.esm.js:1847 invokeWithErrorHandling @ vue.runtime.esm.js:1870 Vue.$watch @ vue.runtime.esm.js:4957 createWatcher @ vue.runtime.esm.js:4913 initWatch @ vue.runtime.esm.js:4895 initState @ vue.runtime.esm.js:4655 Vue._init @ vue.runtime.esm.js:5010 VueComponent @ vue.runtime.esm.js:5158 createComponentInstanceForVnode @ vue.runtime.esm.js:3301 init @ vue.runtime.esm.js:3130 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 updateChildren @ vue.runtime.esm.js:6250 patchVnode @ vue.runtime.esm.js:6353 updateChildren @ vue.runtime.esm.js:6227 patchVnode @ vue.runtime.esm.js:6353 patch @ vue.runtime.esm.js:6516 Vue._update @ vue.runtime.esm.js:3957 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 run @ vue.runtime.esm.js:4564 flushSchedulerQueue @ vue.runtime.esm.js:4320 eval @ vue.runtime.esm.js:1988 flushCallbacks @ vue.runtime.esm.js:1914 Promise.then (async) timerFunc @ vue.runtime.esm.js:1941 nextTick @ vue.runtime.esm.js:1998 queueWatcher @ vue.runtime.esm.js:4412 update @ vue.runtime.esm.js:4554 notify @ vue.runtime.esm.js:731 reactiveSetter @ vue.runtime.esm.js:1056 proxySetter @ vue.runtime.esm.js:4638 _callee2$ @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:388 tryCatch @ runtime.js:63 invoke @ runtime.js:294 eval @ runtime.js:119 asyncGeneratorStep @ asyncToGenerator.js:5 _next @ asyncToGenerator.js:27 Promise.then (async) asyncGeneratorStep @ asyncToGenerator.js:15 _next @ asyncToGenerator.js:27 eval @ asyncToGenerator.js:34 eval @ asyncToGenerator.js:23 open @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:396 handleAddUpdate @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=script&lang=js&:264 click @ cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"3f5280c5-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=template&id=65104a6b&:235 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 invokeWithErrorHandling @ vue.runtime.esm.js:1862 Vue.$emit @ vue.runtime.esm.js:3897 handleClick @ element-ui.common.js:9457 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 original._wrapper @ vue.runtime.esm.js:6951 Show 34 more frames vue.runtime.esm.js:620 [Vue warn]: Error in render: "TypeError: this.forest.selectedNodeIds.filter is not a function" found in ---> <VueTreeselect> at src/components/Treeselect.vue <SelectTree> at src/components/SelectTree/index.vue <ElFormItem> at packages/form/src/form-item.vue <ElForm> at packages/form/src/form.vue <ElDialog> at packages/dialog/src/component.vue <PrivilegeOperate> at src/components/Views/PrivilegeOperate.vue <Privilege> at src/views/system/privilege.vue <AppMain> at src/layout/components/AppMain.vue <Layout> at src/layout/index.vue <App> at src/App.vue <Root> warn @ vue.runtime.esm.js:620 logError @ vue.runtime.esm.js:1892 globalHandleError @ vue.runtime.esm.js:1887 handleError @ vue.runtime.esm.js:1847 Vue._render @ vue.runtime.esm.js:3565 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 updateChildren @ vue.runtime.esm.js:6250 patchVnode @ vue.runtime.esm.js:6353 updateChildren @ vue.runtime.esm.js:6227 patchVnode @ vue.runtime.esm.js:6353 patch @ vue.runtime.esm.js:6516 Vue._update @ vue.runtime.esm.js:3957 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 run @ vue.runtime.esm.js:4564 flushSchedulerQueue @ vue.runtime.esm.js:4320 eval @ vue.runtime.esm.js:1988 flushCallbacks @ vue.runtime.esm.js:1914 Promise.then (async) timerFunc @ vue.runtime.esm.js:1941 nextTick @ vue.runtime.esm.js:1998 queueWatcher @ vue.runtime.esm.js:4412 update @ vue.runtime.esm.js:4554 notify @ vue.runtime.esm.js:731 reactiveSetter @ vue.runtime.esm.js:1056 proxySetter @ vue.runtime.esm.js:4638 _callee2$ @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:388 tryCatch @ runtime.js:63 invoke @ runtime.js:294 eval @ runtime.js:119 asyncGeneratorStep @ asyncToGenerator.js:5 _next @ asyncToGenerator.js:27 Promise.then (async) asyncGeneratorStep @ asyncToGenerator.js:15 _next @ asyncToGenerator.js:27 eval @ asyncToGenerator.js:34 eval @ asyncToGenerator.js:23 open @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:396 handleAddUpdate @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=script&lang=js&:264 click @ cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"3f5280c5-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=template&id=65104a6b&:235 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 invokeWithErrorHandling @ vue.runtime.esm.js:1862 Vue.$emit @ vue.runtime.esm.js:3897 handleClick @ element-ui.common.js:9457 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 original._wrapper @ vue.runtime.esm.js:6951 Show 33 more frames vue.runtime.esm.js:1896 TypeError: this.forest.selectedNodeIds.filter is not a function at VueComponent.internalValue (vue-treeselect.cjs.js:888:53) at Watcher.get (vue.runtime.esm.js:4489:25) at Watcher.evaluate (vue.runtime.esm.js:4591:21) at VueComponent.computedGetter [as internalValue] (vue.runtime.esm.js:4843:17) at VueComponent.hasValue (vue-treeselect.cjs.js:930:19) at Watcher.get (vue.runtime.esm.js:4489:25) at Watcher.evaluate (vue.runtime.esm.js:4591:21) at VueComponent.computedGetter [as hasValue] (vue.runtime.esm.js:4843:17) at VueComponent.wrapperClass (vue-treeselect.cjs.js:3836:43) at Watcher.get (vue.runtime.esm.js:4489:25) logError @ vue.runtime.esm.js:1896 globalHandleError @ vue.runtime.esm.js:1887 handleError @ vue.runtime.esm.js:1847 Vue._render @ vue.runtime.esm.js:3565 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 patch @ vue.runtime.esm.js:6511 Vue._update @ vue.runtime.esm.js:3954 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 Watcher @ vue.runtime.esm.js:4478 mountComponent @ vue.runtime.esm.js:4082 Vue.$mount @ vue.runtime.esm.js:8449 init @ vue.runtime.esm.js:3134 createComponent @ vue.runtime.esm.js:6012 createElm @ vue.runtime.esm.js:5959 createChildren @ vue.runtime.esm.js:6087 createElm @ vue.runtime.esm.js:5988 updateChildren @ vue.runtime.esm.js:6250 patchVnode @ vue.runtime.esm.js:6353 updateChildren @ vue.runtime.esm.js:6227 patchVnode @ vue.runtime.esm.js:6353 patch @ vue.runtime.esm.js:6516 Vue._update @ vue.runtime.esm.js:3957 updateComponent @ vue.runtime.esm.js:4075 get @ vue.runtime.esm.js:4489 run @ vue.runtime.esm.js:4564 flushSchedulerQueue @ vue.runtime.esm.js:4320 eval @ vue.runtime.esm.js:1988 flushCallbacks @ vue.runtime.esm.js:1914 Promise.then (async) timerFunc @ vue.runtime.esm.js:1941 nextTick @ vue.runtime.esm.js:1998 queueWatcher @ vue.runtime.esm.js:4412 update @ vue.runtime.esm.js:4554 notify @ vue.runtime.esm.js:731 reactiveSetter @ vue.runtime.esm.js:1056 proxySetter @ vue.runtime.esm.js:4638 _callee2$ @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:388 tryCatch @ runtime.js:63 invoke @ runtime.js:294 eval @ runtime.js:119 asyncGeneratorStep @ asyncToGenerator.js:5 _next @ asyncToGenerator.js:27 Promise.then (async) asyncGeneratorStep @ asyncToGenerator.js:15 _next @ asyncToGenerator.js:27 eval @ asyncToGenerator.js:34 eval @ asyncToGenerator.js:23 open @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/Views/PrivilegeOperate.vue?vue&type=script&lang=js&:396 handleAddUpdate @ cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=script&lang=js&:264 click @ cjs.js?{"cacheDirectory":"node_modules/.cache/vue-loader","cacheIdentifier":"3f5280c5-vue-loader-template"}!./node_modules/vue-loader/lib/loaders/templateLoader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/views/system/privilege.vue?vue&type=template&id=65104a6b&:235 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 invokeWithErrorHandling @ vue.runtime.esm.js:1862 Vue.$emit @ vue.runtime.esm.js:3897 handleClick @ element-ui.common.js:9457 invokeWithErrorHandling @ vue.runtime.esm.js:1862 invoker @ vue.runtime.esm.js:2187 original._wrapper @ vue.runtime.esm.js:6951 Show 32 more frames index.js?http://192.168.1.3:8001&sockPath=/sockjs-node:172 [WDS] Disconnected! close @ index.js?http://192.168.1.3:8001&sockPath=/sockjs-node:172 eval @ socket.js:26 EventTarget.dispatchEvent @ sockjs.js:170 eval @ sockjs.js:967 setTimeout (async) SockJS._close @ sockjs.js:955 SockJS._receiveInfo @ sockjs.js:784 g @ sockjs.js:66 EventEmitter.emit @ sockjs.js:86 eval @ sockjs.js:556
原因找到了,
初始值必须是null而不能是''。
https://githubmemory.com/repo/riophae/vue-treeselect/issues/441
@yangup Thank you so much for posting the solution. I couldn't get past that error and this helped me very much
错误 信息 :