递归生成对象

服务器返回的数据:

{
	"code": 1000,
	"msg": "操作成功!",
	"data": [
    {
		"callReasonNumber": "10",
      	"callReason": "创伤",
      	"list": [
       	{
          	"callReasonNumber": "1001",
          	"callReason": "交通伤",
          	"list": []
        },
        {
          	"callReasonNumber": "1002",
          	"callReason": "钝器伤",
          	"list": []
        }
		]
	},
	{
      	"callReasonNumber": "11",
      	"callReason": "非创伤",
      	"list": [
        {
         	 "callReasonNumber": "1101",
         	 "callReason": "昏迷/晕厥",
         	 "list": []
        },
        {
         	 "callReasonNumber": "1102",
         	 "callReason": "头痛",
         	 "list": []
        },
       	]
	}

需要展示数据的形式:

const targetData = [
  {
    value: 'zhinan',
    label: '指南',
    children: [
      {
        value: 'shejiyuanze',
        label: '设计原则',
        children: [
          {
            value: 'yizhi',
            label: '一致'
          },
          {
            value: 'fankui',
            label: '反馈'
          },
          {
            value: 'xiaolv',
            label: '效率'
          },
          {
            value: 'kekong',
            label: '可控'
          }
        ]
      }
    ]
  }
];

代码

要递归遍历一个嵌套的对象数组结构,直到 list 属性为空数组,使用递归函数来实现。
当list为空时,chindren属性存在,且为undefined:

transformData (data) {
  return data.map(item => ({
    value: item.callReasonNumber,
    label: item.callReason,
    children: item.list.length > 0 ? this.transformData(item.list) : undefined
  }));
},

当list为空时,children属性不存在:

transformData (data) {
   return data.map(item => ({
     value: item.callReasonNumber,
     label: item.callReason,
     ...(item.list.length > 0 && { children: this.transformData(item.list) })
   }));
 },
  • 如果条件表达式返回的是一个对象{ children: this.transformData(item.list) },则展开该对象并将 children 属性添加到目标对象中。
  • 如果条件表达式返回 false,则什么也不添加。

相关推荐

  1. 生成对象

    2024-07-12 10:06:05       24 阅读
  2. <span style='color:red;'>递</span><span style='color:red;'>归</span>

    2024-07-12 10:06:05      43 阅读
  3. 推与

    2024-07-12 10:06:05       52 阅读
  4. [] 平衡矩阵

    2024-07-12 10:06:05       50 阅读

最近更新

  1. docker php8.1+nginx base 镜像 dockerfile 配置

    2024-07-12 10:06:05       66 阅读
  2. Could not load dynamic library ‘cudart64_100.dll‘

    2024-07-12 10:06:05       70 阅读
  3. 在Django里面运行非项目文件

    2024-07-12 10:06:05       57 阅读
  4. Python语言-面向对象

    2024-07-12 10:06:05       68 阅读

热门阅读

  1. Mybatis SQL注解使用场景

    2024-07-12 10:06:05       16 阅读
  2. python 缩放照片

    2024-07-12 10:06:05       24 阅读
  3. 谈一谈徒劳的坐地收益的副业问题

    2024-07-12 10:06:05       26 阅读
  4. Milvus Cloud向量数据库:优势解析与深度应用探索

    2024-07-12 10:06:05       21 阅读
  5. MyBatis与数据库交互的四种方法详解

    2024-07-12 10:06:05       18 阅读
  6. uni-app 扫描二维码获取信息功能

    2024-07-12 10:06:05       20 阅读