问题:
el-tree根据数组对象的结构进行渲染,当我们勾选了想要的数据后只会生成一个数组
想要的效果:
把获取选中的数据(数组),根据父A下的子a的结构,进行父子级对应的数据结构转换
我的数据结构:
贴代码:直接复制,改一下变量名即可使用
<el-tree
:data="collectionListData"
show-checkbox
node-key="id"
@check="checkFn"
ref="tree"
:props="defaultProps">
</el-tree>
// 下面代码中出现的devices是我的子级数组数据,记得更改
checkFn(data, node) {
let nodearr = [];
if (!node.halfCheckedKeys.length) {
node.checkedNodes.forEach((item) => {
if (item.devices) {
nodearr.push(item);
}
});
} else {
let nodeCheckedNodes = node.checkedNodes;
let nodeHalfCheckedNodes = node.halfCheckedNodes;
nodeHalfCheckedNodes.forEach((item) => {
let assign = Object.assign({}, item);
assign.devices = [];
let childrenLength = item.devices;
for (let i = 0; i < nodeCheckedNodes.length; i++) {
if (nodeCheckedNodes[i].devices) {
nodearr.push(nodeCheckedNodes[i]);
} else {
for (let j = 0; j < childrenLength.length; j++) {
if (nodeCheckedNodes[i].id != childrenLength[j].id) {
continue;
} else {
assign.devices.push(childrenLength[j]);
}
}
}
}
nodearr.push(assign);
});
}
this.nodeList = nodearr;
},