前端数组转树形数据

前言

去后台查询，结果是一个List，可以很容易地自己组装出数组。然后再使用数组转为Tree。

代码

//此处省略list转数组的方法
optionData(data) {
    console.log('开始转换为树形数据');
    let cloneData = JSON.parse(JSON.stringify(data)); // 对源数据深度克隆
    return cloneData.filter(father => { // 循环所有项，并添加children属性
        let branchArr = cloneData.filter(child => father.value == child.parentId); // 返回每一项的子级数组
        branchArr.length > 0 ? father.children = branchArr : ''; //给父级添加一个children属性，并赋值
        return father.parentId == 0; //返回第一层
    });
}, //将查询到的list转为树形
let treedata = this.optionData(data);

参数data的数据格式如下：

[{ 
	value: 'Jin',
	label: '山西',
	parentId: 'Cn'
},{
	value: 'Cn',
	label: '中国',
	parentId: '0’
}]

最后呈现出来的结果如下图：