el-cascader 懒加载与回显 很简单

<el-cascader v-model="tableInfo.data.PlcTagPoint" :show-all-levels="false"

                            :props="PLCProps" clearable filterable />

             

const PLCProps = {   

    lazy: true,

    lazyLoad(node: any, resolve: (arg0: { value: string; label: string; leaf: boolean }[]) => void) {

        const { level } = node

        setTimeout(async () => {

            let ParentID = node.data.id == undefined ? 0 : node.data.id

            let obj = {

                ParentID: ParentID,

                Type: level

            }

            let res = await GetTagTreeLazy(obj)

            const nodes = res.map((item: any) => ({

                value: item.Type + '-' + item.ID,//如果不同层级中有相同的ID就必须加上区分标识（此处我加的是item.Type为层级类型）

                id: item.ID,

                label: item.Name,

                leaf: level >= 2,//2代表显示3级

            }))

            resolve(nodes)

        }, 500)

    }

}

//对象有省略

let tableInfo = reactive({

    data: {       

        PlcTagPoint: [] as any

    }

}

// 编辑

const editDrawer = async (row: any) => {   

    let NewRow = JSON.parse(JSON.stringify(row))

    //回显最重要的地方：格式为数组

    NewRow.PlcTagPoint = JSON.parse(NewRow.PlcTagPoint)   

}