方法:
// 定义树结构
var tree = {
name: "Root",
children: [
{
name: "Child 1",
children: [
{ name: "Grandchild 1" },
{ name: "Grandchild 2" }
]
},
{
name: "Child 2",
children: [
{ name: "Grandchild 3" },
{ name: "Grandchild 4" }
]
}
]
};
// 递归函数,用于给树结构增加层级
function addLevel(node, level, index) {
node.level = level;//主层
if(level!=0){
node.index = index//子层
}
if (node.children) {
node.children.forEach((child,index) =>{
addLevel(child, level + 1, index+1);
});
}
}
// 调用递归函数,给树结构增加层级
addLevel(tree, 0, 0);
表格中使用:
<el-table-column prop="level" label="层级" fixed min-width="160">
<template #default="{ row }">
<span>
<span>{{ row.parentId == -1 ? '0' : `${row.level}.${row.index}` }}</span>
</span>
</template>
</el-table-column>
结果: