一、最主要的几点就是

1、绑值:value=“form.astdeptId”，主要绑的就是id，通过id找到对应的label回显

2、options是数据源，正常调接口获取就行了

3、append-to-body=”true”这个最好加上，可能会遇到下拉的弹窗打不开或者只有一点点高的情况

4、（******）normalizer属性就是把我们自己的后端返的数据格式按树插件需要的格式转换

tenantIdnormalizer(node) {if (node.children && !node.children.length) {delete node.children}return {id: node.id,label: node.name,children: node.children}},

5、select点击事件里赋值

6、插槽slot=“option-label” 是下拉框的值

7、插槽slot=“value-label” 是输入框回显的值

二、引入
import XTreeselect from ‘@riophae/vue-treeselect'//样式import ‘@riophae/vue-treeselect/dist/vue-treeselect.css'

三、使用

{{ baseInfo.approvalName }}{{ node.raw.name ? node.raw.name + "-snows" : "" }}{{ node.raw.name ? node.raw.name + "-s" : "" }}取 消确 定import XTreeSelect from "@riophae/vue-treeselect"// import the stylesimport "@riophae/vue-treeselect/dist/vue-treeselect.css"export default {name: "",components: {XTreeSelect},data() {return {dialogVisible: false,baseInfo: {approvalName: "",approvalPersnal: []},options: [{id: 1,name: "东南",children: [{id: 2,name: "上海",children: [{ id: 3, name: "普陀" },{ id: 4, name: "黄埔" },{ id: 5, name: "徐汇" }]},{id: 7,name: "江苏",children: [{ id: 8, name: "南京" },{ id: 9, name: "苏州" },{ id: 10, name: "无锡" }]},{id: 12,name: "浙江",children: [{ id: 13, name: "杭州" },{ id: 14, name: "宁波" },{ id: 15, name: "嘉兴" }]}]},{id: 17,name: "西北",children: [{id: 18,name: "陕西",children: [{ id: 19, name: "西安" },{ id: 20, name: "延安" }]},{id: 21,name: "新疆维吾尔族自治区",children: [{ id: 22, name: "乌鲁木齐" },{ id: 23, name: "克拉玛依" }]}]}],}},created() {},methods: {tenantIdnormalizer(node) {if (node.children && !node.children.length) {delete node.children}return {id: node.id,label: node.name,children: node.children}},}}