loadOptions can not update the options' children ( LOAD_CHILDREN_OPTIONS && callback ) when async is true

[Aseisman]

当我结合async使用时，异步加载children的值，并不会直接刷新视图，只会在搜索时生效（随便搜索一个字符，再返回即可看见children的值展示出来），这个情况只有调用refs.initialize()重新初始化，才会生效； demo:

<template>
  <div>
    <Treeselect
      ref="treeselect"
      :async="true"
      :default-options="defaultOptions"
      v-model="value"
      :options="options"
      :load-options="loadOptions"
      :disable-branch-nodes="true"
      :auto-load-root-options="false"
      placeholder="Try expanding any folder option..."
    />
  </div>
</template>
<script>
import Treeselect from '@riophae/vue-treeselect';
import { LOAD_CHILDREN_OPTIONS, ASYNC_SEARCH, LOAD_ROOT_OPTIONS } from '@riophae/vue-treeselect';
export default {
  components: { Treeselect },
  data() {
    return {
      defaultOptions: [
        { id: -1, label: 'all menber', children: null },
        {
          id: 1,
          label: 'department 1',
          children: null
        }
      ],
      value: [],
      options: []
    };
  },
  methods: {
    loadOptions({ action, parentNode, callback }) {
      console.log(this.$refs['treeselect']);
      if (action === LOAD_CHILDREN_OPTIONS) {
        setTimeout(() => {
          parentNode.children = [
            {
              id: 1,
              label: '111'
            },
            {
              id: 2,
              label: '222'
            }
          ];
          callback();
          this.$refs['treeselect'].initialize();
        }, 2000);
      } else if (action === ASYNC_SEARCH) {
        console.log(222);
        console.log(action);
        setTimeout(() => {
          callback(null, [
            {
              id: 1,
              label: 'search 1'
            },
            {
              id: 2,
              label: 'search 2'
            }
          ]);
        }, 2000);
      } else {
        console.log(action);
        console.log(333);
      }
    }
  },
};
</script>

[HenryAveMedi]

I stumbled upon this, because I also wanted to combine both features of having defaultOptions loaded, but use async search to search my database including the children that are not yet loaded……

After fiddling back and forth, I can only think abut a workaround, but i don't think is even possible. I haven't seen any updates here in a very long time so I don't think this package is still being maintained, which is sad, because in my opinion, is the best treeselect component available for vue.

After testing all possible behaviors, i saw that when you click to load children, the action and functions are properly called back, but the update doesn't render in the frontend, but if after this you do an async search, this callback will force the component to re-render the options as well…… so this side effect causes that previously clicked items that loaded options but didn't show them, suddenly they did.

So I thought, what if after a loadoptions action, we could force the component to simulate a search so it forces it to reload the options?

[FKdamn]

老哥 你解决了吗? 教我一下