美文网首页
获取树形结构的下标转换为数据

获取树形结构的下标转换为数据

作者: 楠楠_c811 | 来源:发表于2018-10-11 16:37 被阅读1次

    工作中用到了树形结构,从antd库上直接拿到的树形结构写好的形式是获取到当前选中的下标。可是后端并不识别下标,所以需要转换一下。
    写完就记录下来,避免下次忘记。

    //新增按钮提交事件
      addSubmit = () => {
        //为当前的key值或者数组赋值,用以将key值转换为后端能识别的数据
        let checkedKeys = this.state.checkedKeys || [];
        let purviewData = this.state.purviewData || [];
        let nodei, nodej, nodek, nodel;
        //循环第一层
        for (let i = 0, leni = purviewData.length; i < leni; i++) {
          //为当前的i赋值
          nodei = purviewData[i];
          //如果key值大于0,证明有选中的下标,将选中的下标赋值给当前i
          nodei.checked = checkedKeys.findIndex(item => item === `0-${i}`) >= 0;
          //循环第二层 j的长度等于当前i的长度
          for (let j = 0, lenj = nodei.nodeVos.length; j < lenj; j++) {
           //为当前的j赋值
            nodej = nodei.nodeVos[j];
            //循环每个i下面的每个j,如果等于item就赋值给当前下标,然后再赋值给nodej当前数据
            nodej.checked = checkedKeys.findIndex(item => item === `0-${i}-${j}`) >= 0;
            // 循环第三层  
            for (let k = 0, lenk = nodej.nodeVos.length; k < lenk; k++) {
            // 为当前的K 赋值
              nodek = nodej.nodeVos[k];
            // 循环每个i下面的每个j下面的每个k,如果大于0 就表示有选中,将选中的下标赋值给当前下标,再赋值给当前数据
              nodek.checked = checkedKeys.findIndex(item => item === `0-${i}-${j}-${k}`) >= 0;
              //循环第四层
              for (let l = 0, lenl = nodek.nodeVos.length; l < lenl; l++) {
              // 为当前的L赋值
                nodel = nodek.nodeVos[k];
              // 循环每个i下面的每个j下面的每个k下面的每个l,如果大于0 就表示有选中,将选中的下标赋值给当前下标,再赋值给当前数据
                nodel.checked = checkedKeys.findIndex(item => item === `0-${i}-${j}-${k}-${l}`) >= 0;
              }
            }
          }
        }
        this.setState({
          purviewData: purviewData
        });
        console.log('purviewData : ', purviewData);
        let params = {
            roleName:this.state.roleName,               //    -- '角色名'
            description:this.state.description,        //    -- '角色描述'
            userId:this.state.selectedUserIds,        //    -- '关联用户id'
            nodeVos: purviewData
        };
        axios.post('/mgt/role/add',params,{
          headers: {
            authtoken: window.localStorage.getItem('authtoken')
          }
        }).then((response)=>{
            this.setState({
              showModal1: false,
            });
            this.getMsgList();
        })
      }
      //算法 用以将获取到的数据转化为key值
      changeCheckedKeys = (menuVos) => {
        //设置初始为空
        let viewCheckedKeys = [];
        //设置每层的值
        let nodei, nodej, nodek, nodel;
        //循环第一层
        for (let i = 0, leni = menuVos.length; i < leni; i++) {
          //将当前选中的值赋值
          nodei = menuVos[i];
          //判断是否有选中的值
          if (nodei.checked) {
            //将选中的某个值push进数组中
            viewCheckedKeys.push(`0-${i}`);
          }
          //同理,循环第二层
          for (let j = 0, lenj = nodei.nodeVos.length; j < lenj; j++) {
            nodej = nodei.nodeVos[j];
            if (nodej.checked) {
              viewCheckedKeys.push(`0-${i}-${j}`);
            }
            //循环第三层
            for (let k = 0, lenk = nodej.nodeVos.length; k < lenk; k++) {
              nodek = nodej.nodeVos[k];
              if (nodek.checked) {
                viewCheckedKeys.push(`0-${i}-${j}-${k}`);
              }
              //循环第四层
              for (let l = 0, lenl = nodek.nodeVos.length; l < lenl; l++) {
                nodel = nodek.nodeVos[k];
                if (nodel.checked) {
                  viewCheckedKeys.push(`0-${i}-${j}-${k}-${l}`);
                }
              }
            }
          }
        }
        // 将这个值return出去
        return viewCheckedKeys;
      }
    
    
    

    相关文章

      网友评论

          本文标题:获取树形结构的下标转换为数据

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