ARTICLE DETAIL

资讯详情

深耕网站建设与运营推广的一线实战洞察。

antd table 列表树形结构展示

antd table 列表树形结构展示
// 原始数据(子节点字段为 subNodes)
const rawData = [{key: '1',name: '父节点',subNodes: [{ key: '1-1', name: '子节点' },],},
];// 转换函数:递归将 subNodes 改为 children
const transformData = (data: any) => {return data.map((item: any) => {const newItem = { ...item };if (newItem.subNodes && newItem.subNodes.length) {newItem.children = transformData(newItem.subNodes); // 递归处理子节点delete newItem.subNodes; // 删除原字段
    }return newItem;});
};// 使用转换后的数据
const treeData = transformData(rawData);

 

返回列表