我直接抛玉吧,如算法有误还请指出,哇哈哈哈哈哈哈哈
树组件的checked状态初始化:根据选中的ID初始化树组件需要的数据类型。例如父是选中状态,子孙全选中;子全选中,对应父选中,父级非全选中,爷爷级就半选;子集飞全选中,父级半选等一次类推。
根据选中的ID初始化checked 选中id对应的子全为选中状态,父级为半选状态 true全选 false半选 'mid' 半选
let data = [
{
id: 1,
children: [
{
id: 11,
children: [
{
id: 111,
},
{
id: 112,
},
{
id: 113,
},
]
},
{
id: 12,
children: [
{
id: 121,
},
{
id: 122,
},
{
id: 123,
},
]
},
]
},
{
id: 2,
children: [
{
id: 21,
children: [
{
id: 211,
},
{
id: 212,
},
{
id: 213,
},
]
},
{
id: 22,
children: [
{
id: 221,
},
{
id: 222,
},
{
id: 223,
},
]
},
]
}
]
let selectId = [
2
]
/**
* 功能是 根据选中的ID初始化checked 选中id对应的子全为选中状态,父级为半选状态 true全选 false半选 'mid' 半选
*
*
**/
function initData(data, selectId, parent = []) {
data.forEach((item, index) => {
if(selectId.includes(item.id)) {
item.checked = true;
// 自己状态改变影响所有父级
if(parent?.length) {
parent.forEach((pItem, pIndex) => {
let f = pItem.children.every((cItem) => cItem.checked === true)
if(f) {
pItem.checked = true;
} else {
pItem.checked = 'mid';
}
})
}
} else if(parent?.length && parent[0] && parent[0].checked === true){
// 直接父级选中自己选中
item.checked = true;
} else {
item.checked = false;
}
if(item && item.children && item.children.length) {
parent.unshift(item);
initData(item.children, selectId, parent);
parent.shift()
}
});
}
initData(data, selectId)
console.log(data)
爷爷级--2
父级-- 21
子级--211