原來的數(shù)據(jù)格式為:
const tree = [
{
id: '111111',
name: 'parent1',
parentId: null
},
{
id: '222222',
name: 'parent2',
parentId: null
},
{
id: '333333',
name: 'children1',
parentId: '111111'
}
]
定義一個過濾函數(shù)：
function filter(arr) {
const parents = arr.filter(item => item.parentId === null)
const newArray = parents.map((item, index) => Object.assign(item, {
children: arr.filter(s => s.parentId === item.id)
}))
return newArray
}
讓我們來分析過濾函數(shù)里：
// parent 應(yīng)該為：
[
{
id: '111111',
name: 'parent1',
parentId: null
},
{
id: '222222',
name: 'parent2',
parentId: null
}
]
Object.assign的作用是去把parentId加入到id相等的父元素的children屬性里舷蟀，否則應(yīng)為空數(shù)組。
map則為遍歷這個數(shù)組，每一個元素都會運(yùn)行這個方法野宜。
所以結(jié)果為：
console.log(filter(tree))
//
[
{
id: '111111',
name: 'parent1',
parentId: null,
children: [
{
id: '222222',
name: 'parent2',
parentId: null
}
]
},
{
id: '222222',
name: 'parent2',
parentId: null,
children: []
}
]
