zoukankan      html  css  js  c++  java
  • antd框架tree树动态插入,解决新版Antd无法使用TreeNodes问题

    本文主要解决:

    iview树形组件使用问题,已经有后台数据,请问如何对应treeData的字段?

    如下所示

     {
              title: 'child 1-1',
              expand: true,
              children: [
                {
                  title: 'leaf 1-1-1',
                  expand: true
                },
                {
                  title: 'leaf 1-1-2',
                  expand: true
                }
              ]
            },
            {
              title: 'child 1-2',
              expand: true,
              children: [
                {
                  title: 'leaf 1-2-1',
                  expand: true
                },
                {
                  title: 'leaf 1-2-1',
                  expand: true
                }
              ]
            }
          ]

    这是iview的demo数据,这里面children title是固定的字段和我们回台返回数据字段不对应怎么办?求指教,比如我真实数据是childrenFilenames,还有就是我不知道有多少层级,怎么和demo里tree对应呢

    方案:

     function getTree(tree = []) {
            let arr = [];
            if (!!tree && tree.length !== 0) {
                tree.forEach(item => {
                    let obj = {};
                    obj.title = item.name;
                    obj.attr = item.attr; // 其他你想要添加的属性
                    obj.expand = false;
                    obj.selected = false;
                    obj.children = getTree(item.childrenFilenames); // 递归调用
                    arr.push(obj);
                });
            }
            return arr;
        }

    最终效果:

    .

  • 相关阅读:
    .NET下的加密解密大全(1): 哈希加密
    orm fluentdata使用相关文章
    xml处理相关文章收藏
    Salty Fish(区间和)
    Fennec VS. Snuke
    Splitting Pile
    ST表(离线RMQ)
    Exponentiation(高精度大数)
    高斯消元(模板)
    Online Judge(字符串-格式)
  • 原文地址:https://www.cnblogs.com/jianxian/p/12629080.html
Copyright © 2011-2022 走看看