在element-UI中，树组件el-tree用于实现左勾选，右列表显示和删除列表项，左侧树形菜单取消对应的勾选

data(){return{treeData:[],filterText:'',//树形菜单默认项defaultProps:{children:'children',label:'label'},appPid:0,selectedMumberList:[]}},methods:{//搜索和过滤filterNode(value,data){if(!value)returntrue;返回data.label.indexOf(value)!==-1;},//节点点击fnClickNode(){//获取选中的子节点列表//getCheckedNodes第一个参数为false表示和父节点一起获取，true表示只获取子节点letselectedMumberList=this.$refs.tree。getCheckedNodes（假，假）；selectedMumberList=selectedMumberList.filter(item=>!item.children);this.selectedMumberList=selectedMumberList;},//移除选中的成员removeMumber(nodeObj,index){this.$confirm('你确定要删除这个成员吗？','Prompt',{confirmButtonText:'OK',cancelButtonText:'Cancel',type:'warning'}).then(()=>{//删除列表中被点击的项this.selectedMumberList.splice(index,1);//取消删除列表对应节点的选中状态this.$refs.tree.setChecked(nodeObj.id,false,true);this.$message({type:'success',message:“剪除成功！”});}).catch(()=>{});},//获取初始数据loadNode(node,resolve){letthat=this;setTimeout(()=>{vardata=[];letparams={"page":1,"size":10,"appPid":node.data.id||0}that.$axios.post('/app/list',params).then(res=>{if(res.data.state==200){console.log(res);res.data.data.map(item=>{item.id=item.appId;item.label=item.appName;item.parentId=node.data.id||0;})data=res.data.data;node.data.children=res.data.data;console.log(数据)解析(数据);}});},200);},},watch:{filterText(val){this.$refs.tree.filter(val);}},