JSON.stringify()树形展示JSON数据

JSON.stringify()方法可以将JavaScript对象转换为JSON字符串。如果要将树形结构的JSON数据展示出来，可以先将源数据进行深度克隆，然后通过遍历源数据，为每个节点添加children属性，最后使用JSON.stringify()方法将处理后的数据转换为JSON字符串。

以下是一个示例代码：

// 假设源数据为以下结构
const source = [
  { id: 1, name: 'node1', parentId: null },
  { id: 2, name: 'node2', parentId: 1 },
  { id: 3, name: 'node3', parentId: 1 },
  { id: 4, name: 'node4', parentId: 2 },
  { id: 5, name: 'node5', parentId: 2 },
  { id: 6, name: 'node6', parentId: 3 },
  { id: 7, name: 'node7', parentId: 3 },
];

// 对源数据进行深度克隆
const cloneData = JSON.parse(JSON.stringify(source));

// 为每个节点添加children属性
cloneData.forEach(item => {
  item.children = cloneData.filter(child => child.parentId === item.id);
});

// 过滤出根节点
const treeData = cloneData.filter(item => item.parentId === null);

// 将处理后的数据转换为JSON字符串
const jsonString = JSON.stringify(treeData);

console.log(jsonString);

运行以上代码，将会输出以下JSON字符串：

[
  {
    "id": 1,
    "name": "node1",
    "parentId": null,
    "children": [
      {
        "id": 2,
        "name": "node2",
        "parentId": 1,
        "children": [
          {
            "id": 4,
            "name": "node4",
            "parentId": 2,
            "children": []
          },
          {
            "id": 5,
            "name": "node5",
            "parentId": 2,
            "children": []
          }
        ]
      },
      {
        "id": 3,
        "name": "node3",
        "parentId": 1,
        "children": [
          {
            "id": 6,
            "name": "node6",
            "parentId": 3,
            "children": []
          },
          {
            "id": 7,
            "name": "node7",
            "parentId": 3,
            "children": []
          }
        ]
      }
    ]
  }
]