JavaScript集合(Array)转树(tree)结构

教程分享 > WEB技术 > JavaScript (1431) 2024-08-07 11:21:12
JavaScript集合(Array)转树(tree)结构

js 原生数组转树形结构
 
/**

 * 将list装换成tree
 * @param {Object} myId 数据主键id
 * @param {Object} pId  数据关联的父级id
 * @param {Object} children 子节点的节点名称
 * @param {Object} paramList list数据集合
 */
function listToTree(myId, pId,children, paramList) {
  function recursion(id,pId,all,item){
    let childrenList=all.filter(ele=>ele[pId] === item[id]);
    if (childrenList&&childrenList.length>0){
      childrenList.forEach(function(f){
        recursion(id,pId,all,f);
      })
      let myChildrenList = item[children];
      if (myChildrenList === undefined){
          myChildrenList=[];
      }
      childrenList.forEach(o=>myChildrenList.push(o));
      item[children]=myChildrenList;
    }
  }

  if (!paramList||paramList.length===0){
    return [];
  }
  let list = JSON.parse(JSON.stringify(paramList));
  let parentList=list.filter(ele=>ele[pId] === null||ele[pId] === undefined);
  if (!parentList){
    return [];
  }
  parentList.forEach(function(it){
    recursion(myId,pId,list,it);
  })
  return  parentList;
}

调用:
	function dealData(){
		let treeData=listToTree('id','pid','subList',listData);
		console.log(treeData);
	}

执行结果:
执行结果
https://www.leftso.com/article/1050.html

相关文章
JavaScript集合(Array)转树(tree)结构js 原生数组转树形结构 /** * 将list装换成tree * @param {Object} myId 数据主键id * ...
前言有时候,我们需要对js的原生对象进行扩展,达到全局使用更方便的效果
jquery插件Viewer.js是一个强大的图片查看工具,Viewer也提供了一个纯js版本的工具,图片查看,Viewer.js,Viewer
Js也导出Excel,能在前台导出的话,将会大大减轻数据库的压力
JavaScript/JS数组清空,删除数组内所有数据。Array=[]与Array.length=0的区别
这里讲解的是一种通过扩展原生JS的方式进行日期格式化​首先,在需要使用的地方添加以下代码Date.prototype.format = function(fmt) { var o ...
javascript(js)onclick 传递多个字符变量参数<a title="点击下载附件" onclick="downloadFile(\''+row.url+'\',\''+ro...
现有js数组数据如下:let dataArray=[{id:1,name:'张三'},{id:2,name:'李四'}];根据id获取js数组的对象let findId=1; let findO...
步骤:1、配置文件webpack.config.js:  {     test:/\.css$/,     loader:'style-loader!css-loader'  ...
js 生成二维码引入qrcode.js该框架基于HTML5原生编写,兼容性较好。支持H5 vue uniapp 微信小程序等。基本使用参考<div id="qrcode"&gtl;<...
在js编程中,也会遇到替换字符串对象中某个字符。这时候就需要使用js内置函数replace了。可以替换一个也可以替换多个,支持正则表达式匹配比较灵活
方式一 spliceJavaScript 中的 splice() 方法可用于在数组中添加或删除元素。如果我们需要删除数组中的元素,可以使用 splice() 方
js/jQuery获取textarea的光标位置实现光标位置插入内容
spring boot 开发技巧,在开发web项目中跳过thyemeleaf模板/js/css等缓存避免每次修改资源文件都需要重启服务器
在初始化的Vue项目中,我们最先接触到的就是main.js,App.vue,index.html这三个文件,从下面创建的一个空白项目中可以看到:​关于三个文件的说明如下:index.html---主页
vue