当前位置:网站首页>把el-tree选中的数组转换为数组对象
把el-tree选中的数组转换为数组对象
2022-07-06 06:04:00 【不要睡觉哦i】
问题:
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;
},
边栏推荐
- Novice entry SCM must understand those things
- Implementation of linked list in address book management system
- 在线问题与离线问题
- Nodejs realizes the third-party login of Weibo
- 【课程笔记】编译原理
- Software test interview questions - Test Type
- IP day 16 VLAN MPLS configuration
- Practice sharing: how to safely and quickly migrate from CentOS to openeuler
- 数学三大核心领域概述:代数
- What are the test sites for tunnel engineering?
猜你喜欢
随机推荐
H3C firewall rbm+vrrp networking configuration
The ECU of 21 Audi q5l 45tfsi brushes is upgraded to master special adjustment, and the horsepower is safely and stably increased to 305 horsepower
单元测试的意义
How to use the container reflection method encapsulated by thinkphp5.1 in business code
Cannot build artifact 'test Web: War expanded' because it is included into a circular depend solution
leaflet 地图
Practice sharing: how to safely and quickly migrate from CentOS to openeuler
Leaflet map
continue和break的区别与用法
对数据安全的思考(转载)
GTSAM中ISAM2和IncrementalFixedLagSmoother说明
进程和线程的理解
Application du Groupe Li dans gtsam
公司視頻加速播放
Nodejs realizes the third-party login of Weibo
IP day 16 VLAN MPLS configuration
异常检测方法总结
Understanding of processes and threads
Grant Yu, build a web page you want from 0
Wib3.0 leapfrogging, in leapfrogging (ง • ̀_•́) ง