iview TreeSelect 异步加载子节点 编辑时不能正常回显

问题描述

因为分类数据太多，首次加载时间太长，和业务沟通改成异步加载子节点，解决了加载缓慢的问题，但编辑的时候回显就不能显示了，因为赋值的时候，下拉框数据中还没有加载已选中的项。该怎么办呢…

解决方案

结合业务考虑，因为分类的ID是输入框手动输入的，没有特定的格式，只根据多个分类的ID用分号分隔了，无法找到其父节点的分类ID，所以不能用递归调用数据的方法。想了一个让分类显示的方法，将需要回显的数据插入到categoryData中，实现编辑分类的回显。

示例代码

<template>
    <TreeSelect
       v-if="item.key === 'broader'"
       v-model="form[item.key]"
       :data="categoryData"
       :load-data="loadTreeList"
       multiple
     />
</template>
<script>
    export default {
     
	    props: {
     
	      categoryData: {
     
	        type: Array,
	        default: () => []
	      }
	    },
	    data () {
     
            return {
     
                value: [],
                nextValue: 1,
                data: [
                    {
     
                        title: 'parent1',
                        value: