```html ``` ```js data: function () { return { mineStatus: "", treedata: [], defaultProps: { children: "children", label: "name" }, } }, handleCheckCh... ...
<el-form-item label="下拉樹選擇器">
<el-select v-model="mineStatus" placeholder="請選擇" multiple collapse-tags>
<el-option :value="mineStatus" style="height: auto">
<el-tree :data="treedata" default-expand-all show-checkbox check-strictly node-key="id"
ref="tree" highlight-current :props="defaultProps"
@check-change="handleCheckChange"></el-tree>
</el-option>
</el-select>
</el-form-item>
data: function () {
return {
mineStatus: "",
treedata: [],
defaultProps: {
children: "children",
label: "name"
},
}
},
handleCheckChange(data, checked, node) {
let res = this.$refs.tree.getCheckedNodes(false, true); //true，1. 是否只是葉子節點 2.選擇的時候不包含父節點）
if (checked) {
this.$refs.tree.setCheckedNodes([data]);
}
let arrLabel = [];
// console.log(res, 'res')
res.forEach(item => {
if (arrLabel.length === 0) {
arrLabel.push(item.name);
} else {
arrLabel.length === 0;
}
});
this.mineStatus = arrLabel;
// console.log(arrLabel, 'arrLabel')
},
