美文网首页
Vue+Element-ui el-tree 后台返回Pid,自

Vue+Element-ui el-tree 后台返回Pid,自

作者: 残_忆 | 来源:发表于2020-05-27 09:28 被阅读0次

    请求到的数据

     this.$nextTick(()=>{
         this.toTreeData(res.data.data, 'id', 'pid', 'name');
         this.resize()
     })
    

    下面的修改对应字段,修改第一位的Pid

    toTreeData(data, id, pid, name) {//找到当前组织的直系子节点
            // 建立个树形结构,需要定义个最顶层的父节点,pId是1
            // console.log(data)
            let parent = [];
            for (let i = 0; i < data.length; i++) {
              // console.log(data[i][pid] == this.myOrgId)
              if (data[i][pid] != '0') {
              } else {
                let obj = {
                  label: data[i][name],
                  id: data[i][id],
                  children: []
                };
    
                parent.push(obj); //数组加数组值
                // console.log(obj);
              }
              
              //  console.log(parent,"bnm");
            }
            this.children(parent,data, id, pid, name);
    
            // 调用子节点方法,参数为父节点的数组
            // console.log(parent);
            // return parent;
          },
          children(parent,data, id, pid, name) {//给当前组织的直系子节点添加剩下的子节点
            // console.log(parent);
            // console.log(data);
            let _this = this;
            if (data) {
              for (let i = 0; i < parent.length; i++) {
                for (let j = 0; j < data.length; j++) {
                  if (parent[i].id == data[j][pid]) {
                    // console.log(data[j].name)
                    let obj = {
                      label: data[j].name,
                      id: data[j][id],
                      children: []
                    };
                    // console.log(obj)
                    parent[i].children.push(obj);
                  }
    
                }
                // console.log(parent[i].children,data)
                _this.children(parent[i].children,data,id, pid);
              }
            }
            _this.treeData = parent
            // console.log(_this.treeData)
          },
    

    相关文章

      网友评论

          本文标题:Vue+Element-ui el-tree 后台返回Pid,自

          本文链接:https://www.haomeiwen.com/subject/zxkoahtx.html