两种方法:
方法一:使用map
const getData = () => {
getOrganization({}).then((res) => {
console.log(res)
options.value = res.data.map((node) => ({
id: node.id,
title: node.title,
children: node.children
? node.children.map((child) => ({
id: child.id,
title: child.title,
children: child.children
? child.children.map((grandchild) => ({
id: grandchild.id,
title: grandchild.title,
}))
: [],
}))
: [],
}))
console.log(options.value, 'options.value')
})
}
方法二:使用递归
// 使用递归第一种方法
const props = withDefaults(defineProps<{ orgSelect: OrgSelectProps }>(), {
orgSelect: () => {
return {
managementId: '',
parkId: '',
compId: '',
}
},
})
const options = ref([])
const getData = () => {
getOrganization({}).then((res) => {
options.value = formatTree(res.data, Object.keys(props.orgSelect).length)
})
}
function formatTree(data: any[], depth) {
if (depth) {
return data.map((i) => {
return {
id: i.id,
title: i.title,
children: formatTree(i.children, depth - 1),
}
})
}
return null
}
// 使用递归第二种方法
function flattenTreeData(data) {
const result = []
function flatten(node) {
// 将当前节点加入结果数组
result.push({
id: node.id,
name: node.name
})
// 如果当前节点有子节点,继续递归处理
if (node.children) {
node.children.forEach(child => flatten(child))
}
}
// 对初始数据进行递归处理
data.forEach(item => flatten(item))
return result
}
const flatData = flattenTreeData(treeData)
console.log(flatData)