求：js 递归方法 - 感觉想好了，一写就不对，附HTML

发布于 2022-09-13 00:14:38 字数 3005 浏览 31 评论 0

求：筛选出包含checked为true的父子链
子项有一项被选中，则返回其父级完整结构（不含未选中的）。
如：3-1-2 子被选中checked true ，那么返回 标题3 的对象，怎么处理，写了半天写糊涂了。。。求解。

<!DOCtype html>
<html lang="en-US">
<head>
    <title>demo</title>
</head>
<body>
  <script>
    const json = [
  {
      "id":4,
      "name":"标题1",
      "checked": true,
      "children":[
          {
              "id":3,
              "name":"1-1",
              "isLeaf": true,
              "children":null
          }
      ]
  },
  {
      "id":5,
      "name":"标题2",
      "children":[
          {
              "id":4,
              "name":"2-1",
              "isLeaf": true,
              "children":null
          },
          {
              "id":5,
              "name":"2-2",
              "isLeaf": true,
              "children":null
          }
      ]
  },
  {
      "id":7,
      "name":"标题3",
      "children":[
          {
              "id":6,
              "name":"3-1",
              "children":[
                {
                  "id": 106,
                  "name": "3-1-1",
                  "children": [
                    {
                      "id":100,
                      "name":"3-1-1-1",
                      "children": null,
                    },
                    {
                      "id":101,
                      "name":"3-1-1-2",
                      "checked":true,
                      "children": null,
                    }
                  ],
                }
              ]
          }
      ]
  }
];
  function returnSelectedTree(list) {
    if (Array.isArray(list) && list.length !== 0) {
      list = list.map((item, index) => {
        // 哪裏有問題
        const children = !item.isLeaf ? item.children.filter(it => it.checked) : [];
        if (children.length > 0) {
          item = {...item, ...{children: children}};
        }
        if (!item.isLeaf) {
          returnSelectedTree(item.children)
        }
        return item;
      });
      return list;
    } else {
      return false;
    }
  }
  returnSelectedTree(json)
  console.log(returnSelectedTree(json));
</script>
</body>
</html>

例如：若 3-1 下的 3-1-2 被选中，则输出标题3 的数据

{
      "id":7,
      "name":"标题3",
      "flag":0,
      "parentId":1,
      "children":[
          {
              "id":6,
              "name":"3-1",
              "flag":0,
              "parentId":7,
              "children":[
                {
                  "id": 106,
                  "name": "3-1-1",
                  "checked": false,
                  "isLeaf": true,
                  "children": null,
                },
                {
                  "id": 106,
                  "name": "3-1-2",
                  "checked": true,
                  "isLeaf": true,
                  "children": null,
                }
              ]
          }
      ]
  }

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

羅雙樹 2022-09-20 00:14:38

以下是问题未修改前的回答：

是的，这代码写的是挺迷糊的：

你的要求应该是筛选出所有包含checked为true的子元素的顶级父级对象吧
给你个简单的写法：

function isChecked(item) {
  if (item.checked) {
    return true
  } else if (Array.isArray(item.children)) {
    for (const subItem of item.children) {
      if(isChecked(subItem)) return true
      else continue
    }
    return false
  } else {
    return false
  }
}
const dataFilter = json.filter(i=>isChecked(i))
console.log(dataFilter)