el-tree搜索的使用
2023.12.11今天我学习了如何对el-tree进行搜索的功能，效果如下：
<template><div class="head-container"><el-inputv-model="roleName"clearableplaceholder="请输入角色/用户名称"prefix-icon="el-icon-search"size="small"style="margin-bottom: 10px"/></div><el-treeref="role_tree":data="roleOptions":expand-on-click-node="false":filter-node-method="filterNode":props="defaultProps"highlight-currentnode-key="id"show-checkbox/>
</template>
<script>
export default{data(){return{roleName:'',roleOptions: [],//角色列表defaultProps: {children: 'children',label: 'label'},}},watch:{roleName(val){this.$refs.role_tree.filter(val)//根据el-tree的ref进行过滤}},methods:{// 筛选节点filterNode(value, data) {if (!value) return truereturn data.label.indexOf(value) !== -1},}
}
</script>