fix: 修复懒加载的时候，删除已选项不成功问题

Author: angrytoro

examples/App.vue

@@ -22,6 +22,7 @@ import Drag from './Drag.vue'
 
 import Loading from './Loading.vue'
 import Search from './Search.vue'
+import SearchRemote from './SearchRemote.vue'
 import Drop from './Drop.vue'
 import DropDataChange from './DropDataChange.vue'
 import Feature from './Feature.vue'
@@ -34,6 +35,7 @@ export default defineComponent({
  Search,
  Drop,
  Drag,
+ SearchRemote,
  // DropDataChange,
  Feature,
  Performance,
@@ -45,7 +47,7 @@ export default defineComponent({
  Performance,
  Loading,
  Search,
- // SearchRemote,
+ SearchRemote,
  // SearchRootRemote,
  Drop,
  // DropRemote,

examples/Search.vue

@@ -1,8 +1,7 @@
 <template>
  <VTreeSearch
- ref="treeSearch"
+ ref="treeSearchRef"
  v-model="value"
- :data="data"
  checkable
  :expandOnFilter="false"
  >
@@ -18,7 +17,7 @@
 <script lang="ts">
 import { VTreeSearch } from '../src'
 import treeDataGenerator from '../tests/tree-data-generator'
-import { defineComponent, reactive, ref } from 'vue-demi'
+import { defineComponent, onMounted, reactive, ref } from 'vue-demi'
 const genData = (extra = {}) => {
  return treeDataGenerator(
  Object.assign(
@@ -40,10 +39,16 @@ export default defineComponent({
  VTreeSearch
  },
  setup(props) {
- const data = reactive(genData().data)
+ // const data = reactive(genData().data)
+ const data = genData().data
  const value = ref('2')
+ const treeSearchRef = ref()
+ onMounted(() => {
+ console.log(treeSearchRef.value.setData(data))
+ })
  return {
- data,
+ treeSearchRef,
+ // data,
  value
  }
  }

examples/SearchRemote.vue

@@ -1,11 +1,6 @@
 <template>
  <div style="height: 100%">
- <VTreeSearch
- v-model="value"
- :load="load"
- search-remote
- checkable
- @search="handleSearch"
+ <VTreeSearch v-model="value" :load="load" checkable
  ><span slot="empty">slot 传进来的暂无数据</span></VTreeSearch
  >
  {{ value }}
@@ -44,9 +39,9 @@ export default defineComponent({
  setTimeout(() => {
  const data = genData({ nodesPerLevel: times[index.value] }).data
  resolve(data)
- }, 10)
+ }, 1000)
  }
- const value = reactive(['93', '124'])
+ const value = ref(['93', '124'])
  function handleSearch() {
  index.value++
  if (index.value >= times.length) index.value = 0

src/components/Tree.vue

@@ -822,20 +822,8 @@ export default defineComponent({
  storeEvents.forEach(eventName => {
  nonReactive.store.on(eventName, (...args: any[]) => {
  ctx.emit.apply(ctx, [eventName, ...args])
- // ctx.emit(eventName, ...args)
  })
  })
- // for (let event in ctx.attrs) {
- // if (storeEvents.indexOf(event as keyof IEventNames) > -1) {
- // const e: keyof IEventNames = event as keyof IEventNames
- // nonReactive.store.on(
- // e,
- // ctx.attrs[event] as
- // | ListenerType<typeof e>
- // | Array<ListenerType<typeof e>>
- // )
- // }
- // }
  }
 
  //#region Calculate nodes

src/components/TreeNode.vue

@@ -164,7 +164,11 @@ export default defineComponent({
  ]
  })
  const fullData = computed(() => {
- return getNode(props.data ? props.data[keyField] : '') || ({} as TreeNode)
+ return (
+ getNode(props.data ? props.data[keyField] : '') ||
+ props.data ||
+ ({} as TreeNode)
+ )
  })
  const showCheckbox = computed(() => {
  return props.checkable

src/components/TreeSearch.vue

@@ -75,7 +75,7 @@ const treeNodePrefixCls = 'ctree-tree-node'
 export default defineComponent({
  name: 'CTreeSearch',
  inheritAttrs: false,
- emits: ['checked-change', 'search', 'set-data', 'update:ModelValue'],
+ emits: ['checked-change', 'search', 'set-data', 'update:modelValue'],
  components: {
  CTree
  },
@@ -167,7 +167,7 @@ export default defineComponent({
  },
  set: newVal => {
  updateCheckedCount()
- emit('update:ModelValue', newVal)
+ emit('update:modelValue', newVal)
  }
  })
  const wrapperCls = computed(() => {