element的树表格和树形控件折叠展开方法

1.绑定表格/tree（树形控件）

  <el-table :data="diffeDataTable" ref="diffeDataTable"  row-key="id"  height="500px" >

注意，树形控件和表格都是ref=“diffeDataTable” ;

2.封装方法

  fold(treeName,arr,isTree){
      //arr就是你的表格数据数组或者树形控件的数组
    let allArr=JSON.parse(JSON.stringify(arr)); //拷贝一份
    let empty=[];
    function recursion(param){
      //通过递归把children拿出来，放到empty数组中，把多维数组改为一维数组
      param.filter((item,key)=>{
     
          empty.push(item);
          item.children && item.children.length>0?recursion(item.children):'';
      })
    }
    recursion(allArr);
    if(isTree){
      //我这是一个按钮，写个开关
      	empty.forEach((item,i)=>{
     
        	//this.$refs.Tree.store.nodesMap[item.id].expanded =true/false;就是控制树形控件折叠和展开的关键语句
      	    //this.$refs.Tree.toggleRowExpansion(item,true/false);  就是树形表格控制折叠和展开的语句  true是展开
            //树形控件和树形表格的区别就这这里，自己选择，treeName=this.$refs.Tree;
            tableName.toggleRowExpansion(item,isTree);

        });
        isTree=false;
     }else{
     
        empty.forEach((item,i)=>{
     
            tableName.toggleRowExpansion(item,isTree);
        });
        isTree=true;
     }

  },

主要就是下面这两个语句在操控,只要知道这两句，方法可以自己封装

 this.$refs.TreeName.store.nodesMap[item.id].expanded =true/false; //就是控制树形控件折叠和展开的关键语句
 this.$refs.TreeName.toggleRowExpansion(item,true/false);  //就是树形表格控制折叠和展开的语句  true是展开

3.调用
我写的开关

{
     
      let self=this;
      let isTree=true;
      if(self.isT){
     
        isTree=true;
        self.isT=false;
      }else{
     
        isTree=false
        self.isT=true
      }
      this.utils.fold(this.$refs.diffeDataTable,self.diffeDataTable,isTree);
}

self.diffeDataTable就是你的表格数据数组或者树形控件的数组