js 数组 转为树形结构

• 阅读 1563

需要转换为树形的数组

 var data = [
         {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"添加剂",
            "pid":13,
            "id":26,
            "state":"1"
        },
        {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"药食同源",
            "pid":13,
            "id":25,
            "state":"1"
        },
        {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"特殊食品",
            "pid":13,
            "id":24,
            "state":"1"
        },
        {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"进口食品",
            "pid":13,
            "id":23,
            "state":"1"
        },
        {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"新资源食品",
            "pid":13,
            "id":22,
            "state":"1"
        },
        {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"绿色有机",
            "pid":13,
            "id":21,
            "state":"1"
        },
        {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"食品检验检测",
            "pid":12,
            "id":20,
            "state":"1"
        },
        {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"标签审核",
            "pid":11,
            "id":19,
            "state":"1"
        },
        {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"法律服务",
            "pid":3,
            "id":18,
            "state":"1"
        },
        {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"案件咨询",
            "pid":3,
            "id":17,
            "state":"1"
        },
        {
            "orderById":null,
            "platformCommissionProportion":1,
            "name":"食品餐饮许可",
            "pid":2,
            "id":16,
            "state":"1"
        }
    ]

转换方法

/**
 * 树形数据转换
 * @param {*} data
 * @param {*} id
 * @param {*} pid
 */
export function treeDataTranslate (data, id = 'id', pid = 'pid') {
  var res = []
  var temp = {}
  for (var i = 0; i < data.length; i++) {
    temp[data[i][id]] = data[i]
  }
  for (var k = 0; k < data.length; k++) {
    if (temp[data[k][pid]] && data[k][id] !== data[k][pid]) {
      if (!temp[data[k][pid]]['children']) {
        temp[data[k][pid]]['children'] = []
      }
      if (!temp[data[k][pid]]['_level']) {
        temp[data[k][pid]]['_level'] = 1
      }
      data[k]['_level'] = temp[data[k][pid]]._level + 1
      temp[data[k][pid]]['children'].push(data[k])
    } else {
      res.push(data[k])
    }
  }
  return res
}

使用方法

// 引入上方的方法
import { treeDataTranslate } from '@/utils/myUtils'

treeDataTranslate(data)

js 数组 转为树形结构

点赞
收藏
评论区
推荐文章
blmius blmius
2年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时,报错:原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等,这样可以更容易地在不同的环境中使用MySQL。全局s
Wesley13 Wesley13
2年前
java将前端的json数组字符串转换为列表
记录下在前端通过ajax提交了一个json数组的字符串,在后端如何转换为列表。前端数据转化与请求varcontracts{id:'1',name:'yanggb合同1'},{id:'2',name:'yanggb合同2'},{id:'3',name:'yang
Jacquelyn38 Jacquelyn38
2年前
2020年前端实用代码段,为你的工作保驾护航
有空的时候,自己总结了几个代码段,在开发中也经常使用,谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )
Easter79 Easter79
2年前
SpringBoot自定义序列化的使用方式
场景及需求:项目接入了SpringBoot开发,现在需求是服务端接口返回的字段如果为空,那么自动转为空字符串。例如:\    {        "id":1,        "name":null    },    {        "id":2,        "name":"x
Stella981 Stella981
2年前
JS 对象数组Array 根据对象object key的值排序sort,很风骚哦
有个js对象数组varary\{id:1,name:"b"},{id:2,name:"b"}\需求是根据name或者id的值来排序,这里有个风骚的函数函数定义:function keysrt(key,desc) {  return function(a,b){    return desc ? ~~(ak
Wesley13 Wesley13
2年前
PHP创建多级树型结构
<!lang:php<?php$areaarray(array('id'1,'pid'0,'name''中国'),array('id'5,'pid'0,'name''美国'),array('id'2,'pid'1,'name''吉林'),array('id'4,'pid'2,'n
Stella981 Stella981
2年前
Django中Admin中的一些参数配置
设置在列表中显示的字段,id为django模型默认的主键list_display('id','name','sex','profession','email','qq','phone','status','create_time')设置在列表可编辑字段list_editable
Wesley13 Wesley13
2年前
ES6 新增的数组的方法
给定一个数组letlist\//wu:武力zhi:智力{id:1,name:'张飞',wu:97,zhi:10},{id:2,name:'诸葛亮',wu:55,zhi:99},{id:3,name:'赵云',wu:97,zhi:66},{id:4,na
Stella981 Stella981
2年前
SpringBoot自定义序列化的使用方式
场景及需求:项目接入了SpringBoot开发,现在需求是服务端接口返回的字段如果为空,那么自动转为空字符串。例如:\    {        "id":1,        "name":null    },    {        "id":2,        "name":"x
Wesley13 Wesley13
2年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_