根据父id和子id处理树形的函数方法

先看一下我们的数据结构

const data = [{id: 1,parentId: 0,name: "Node 1"},{id: 2,parentId: 1,name: "Node 2"},{id: 3,parentId: 1,name: "Node 3"},{id: 4,parentId: 2,name: "Node 4"},{id: 5,parentId: 2,name: "Node 5"}
];

这是一个标准的数据，带有父id和子id的数据

然后先把我们父级id等于0的数据过滤出来，因为父级id等于0的，证明这条数据已经没有父级了，这就是我们最外层的数据

const rootNodes = data.filter(node => node.parentId === 0);

现在我们的rootNodes的数据是parentId为0的数据

// 递归函数，用于返回给定父节点的所有子节点
function getChildren(parentNode, nodes) {return nodes.filter(node => node.parentId === parentNode.id).map(node => ({...node,children: getChildren(node, nodes)}));
}// 递归地生成树形结构
const tree = rootNodes.map(node => ({...node,// 这里的data是我们的全部数据children: getChildren(node, data)
}));

根据父id和子id处理树形的函数方法相关推荐

vue/uniapp父组件获取子组件内的数据或方法
1.父组件主动获取子组件中的数据和方法在父组件里面通过: ``` this.$refs.childMethod.属性 this.$refs.childMethod.方法 ``` 在父组件中:(调用子 ...
递归查找所有子代id php,PHP递归函数：从父ID获取子ID
我正在尝试使用以下代码从数组的父ID中获取所有孩子 $temp = array(); $temp[] = array("id"=>"2", "p ...
js获取父元素、子元素、兄弟元素的方法
Magento 获取分类的父分类和子分类
在Magento目录的分类页面里,经常需要左侧导航获取到父分类和子分类,可以用以下方法: 打开app/your_package/your_themes/template/catalog/navigat ...
vue组件,父传子、子传父、父调子、子调父简单理解总结
总结目录方法总结子组件获取父组件变量(也可用父组件调用子组件中的方法传值) 父组件获取子组件变量(介绍两种方法) 父组件调用子组件中的方法子组件调用父组件中方法(介绍两种方法) 方法总结 vue ...
vue父页面调用子页面及方法及传参，鼠标光标定位
项目场景: vue父页面调用子页面及方法问题描述 vue中父界面调用子界面及方法时界面可以调用,但是调用方法的时候第一次报错,但是关掉界面再次重新打开就没问题了原因分析: 在我之前添加鼠标指针定位 ...
VMware找不到父磁盘父虚拟磁盘在子虚拟磁盘创建之后被修改过。父虚拟磁盘的内容 ID 与子虚拟磁盘中对应的父内容 ID 不匹配
在移动VMDK磁盘或者更改操作系统后,往往会出现"VMware找不到父磁盘父虚拟磁盘在子虚拟磁盘创建之后被修改过.父虚拟磁盘的内容 ID 与子虚拟磁盘中对应的父内容 ID 不匹配" ...
sql函数：多级树状目录-根据父ID查询出所有的子ID
一. 简介比如说部门,有上级部门,是多级的,需要根据部门ID查询出所有该部门的子部门. 如果是2级,可以通过左连接联查同一张表即可. 但层级数不确定的情况下,就得用sql函数或者存储过程来实现了. ...
mysql查询父id下所有子id，或者通过子id查询所有父id到最上层
文章目录前言一.通过父id查询所有子id 1.数据库 2.查询语句 3.SQL解释二.通过子id查询父id到根节点 1.查询语句总结前言显示实现通过父id查询所有子id数据:第二部分同子i ...

根据父id和子id处理树形的函数方法

根据父id和子id处理树形的函数方法相关推荐

最新文章

热门文章