<script>
export default {
data() {
return {
data: [{
label: '一级 1',
children: [{
label: '二级 1-1',
children: [{
label: '三级 1-1-1',
children:[]
}]
}]
}, {
label: '一级 2',
children: [{
label: '二级 2-1',
children: [{
label: '三级 2-1-1',
children:[]
}]
}, {
label: '二级 2-2',
children: [{
label: '三级 2-2-1',
children:[]
}]
}]
}, {
label: '一级 3',
children: [{
label: '二级 3-1',
children: [{
label: '三级 3-1-1',
children:[]
}]
}, {
label: '二级 3-2',
children: [{
label: '三级 3-2-1',
children:[]
}]
}]
}],
isShowSelect:false,
form:{input1:''}
};
},
watch: {
form: {
handler(form){
if(this.isShowSelect){
this.$refs.selectTree.filter(form.input1);
}
},
deep: true,//深度监听,重要
},
},
methods: {
selectClassfy(data) {
this.form.input1=data.label;
this.isShowSelect=false;
},
changeSelectTree(){
this.isShowSelect=true;
},
hideParentClick(e) {
var isOther = e.relatedTarget == null || e.relatedTarget.closest("-tree")
== null || e.relatedTarget.closest("-tree").id != "floatTree";
if (isOther) {
this.isShowSelect = false;
} else {
e.target.focus();
}
},
// 选择器的树节点
filterNode(value, data) {
if (!value) return true;
return data.label.indexOf(value) !== -1;
},
}
};
</script>