js递归生成树形结构-vue

{
"code": "0",
"message": "SUCCESS",
"data": [
{
"code": 1,
"parentCode": 0,
"value": "IPO上市",
"status": 0,
"comment": "IPO上市",
"showOrder": 1
},
{
"code": 2,
"parentCode": 0,
"value": "公司制改建",
"status": 0,
"comment": "公司制改建",
"showOrder": 2
},
{
"code": 3,
"parentCode": 0,
"value": "对外投资",
"status": 0,
"comment": "对外投资",
"showOrder": 3
},
{
"code": 4,
"parentCode": 0,
"value": "接受投资",
"status": 0,
"comment": "接受投资",
"showOrder": 4
},
{
"code": 5,
"parentCode": 0,
"value": "合并、分立、破产、清算、解散",
"status": 0,
"comment": "合并、分立、破产、清算、解散",
"showOrder": 5
},
{
"code": 6,
"parentCode": 0,
"value": "股东股权比例变动",
"status": 0,
"comment": "股东股权比例变动",
"showOrder": 6
},
{
"code": 7,
"parentCode": 0,
"value": "产权转让",
"status": 0,
"comment": "产权转让",
"showOrder": 7
},
{
"code": 8,
"parentCode": 0,
"value": "上市公司发行股份购买资产",
"status": 0,
"comment": "上市公司发行股份购买资产",
"showOrder": 8
},
{
"code": 9,
"parentCode": 0,
"value": "资产转让、置换、拍卖",
"status": 0,
"comment": "资产转让、置换、拍卖",
"showOrder": 9
},
{
"code": 10,
"parentCode": 0,
"value": "资产抵押/质押",
"status": 0,
"comment": "资产抵押/质押",
"showOrder": 10
},
{
"code": 11,
"parentCode": 0,
"value": "资产捐赠",
"status": 0,
"comment": "资产捐赠",
"showOrder": 11
},
{
"code": 12,
"parentCode": 0,
"value": "资产租赁",
"status": 0,
"comment": "资产租赁",
"showOrder": 12
},
{
"code": 13,
"parentCode": 0,
"value": "资产补偿/损失补偿",
"status": 0,
"comment": "资产补偿/损失补偿",
"showOrder": 13
},
{
"code": 14,
"parentCode": 0,
"value": "资产偿债",
"status": 0,
"comment": "资产偿债",
"showOrder": 14
},
{
"code": 15,
"parentCode": 0,
"value": "资产涉讼",
"status": 0,
"comment": "资产涉讼",
"showOrder": 15
},
{
"code": 16,
"parentCode": 0,
"value": "资产收购",
"status": 0,
"comment": "资产收购",
"showOrder": 16
},
{
"code": 17,
"parentCode": 0,
"value": "接受抵债资产",
"status": 0,
"comment": "接受抵债资产",
"showOrder": 17
},
{
"code": 18,
"parentCode": 0,
"value": "债转股",
"status": 0,
"comment": "债转股",
"showOrder": 18
},
{
"code": 19,
"parentCode": 0,
"value": "债务重组及其他",
"status": 0,
"comment": "债务重组及其他",
"showOrder": 19
},
{
"code": 20,
"parentCode": 0,
"value": "追溯评估",
"status": 0,
"comment": "追溯评估",
"showOrder": 20
},
{
"code": 21,
"parentCode": 0,
"value": "复核报告",
"status": 0,
"comment": "复核报告",
"showOrder": 21
},
{
"code": 22,
"parentCode": 0,
"value": "了解价值",
"status": 0,
"comment": "了解价值",
"showOrder": 22
},
{
"code": 23,
"parentCode": 0,
"value": "财务会计报告目的",
"status": 0,
"comment": "财务会计报告目的",
"showOrder": 23
},
{
"code": 24,
"parentCode": 0,
"value": "计税价格评估",
"status": 0,
"comment": "计税价格评估",
"showOrder": 24
},
{
"code": 25,
"parentCode": 0,
"value": "认定报关价格",
"status": 0,
"comment": "认定报关价格",
"showOrder": 25
},
{
"code": 26,
"parentCode": 0,
"value": "其他",
"status": 0,
"comment": "其他",
"showOrder": 26
}
]
}

// 生成树结构
    initTree (parentCode) {
      // jsonArray 变量数据
      // 第一次以后：根据id去查询parent_id相同的（相同为子数据）
      // 第一次：查找所有parent_id为-1的数据组成第一级
      let that = this
      let res = that.dataList // 你的树结构

      const child = res.filter(item => item.parentCode == parentCode)
      // 第一次：循环parent_id为-1数组
      return child.map(item => ({
          ...item,
          // 当前存在id（id与parent_id应该是必须有的）调用initTree() 查找所有parent_id为本id的数据
          // childs字段写入
          childs: that.initTree(item.code)
      }))
    },

this.initTree(0)

js递归生成树形结构-vue

相关推荐