当前位置:网站首页>把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;
},
边栏推荐
- 曼哈顿距离与曼哈顿矩形-打印回字型矩阵
- VINS-Mono: A Robust and Versatile Monocular Visual-Inertial State Estimator
- How to recover Huawei router's forgotten password
- Basic knowledge of error
- 10M25DCF484C8G(FPGA) AMY-6M-0002 BGA GPS模块
- [course notes] Compilation Principle
- 【C语言】字符串左旋
- 数学三大核心领域概述:几何
- Buuctf-[gxyctf2019] no dolls (xiaoyute detailed explanation)
- LeetCode 731. 我的日程安排表 II
猜你喜欢
如何在业务代码中使用 ThinkPHP5.1 封装的容器内反射方法
LeetCode 1200. 最小绝对差
Practice sharing: how to safely and quickly migrate from CentOS to openeuler
Manhattan distance and Manhattan rectangle - print back font matrix
Web服务连接器:Servlet
HCIA review
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
【Postman】测试(Tests)脚本编写和断言详解
C language bubble sort
数字三角形模型 AcWing 1015. 摘花生
随机推荐
[postman] collections configuration running process
wib3.0 跨越,在跨越(ง •̀_•́)ง
Sqlmap tutorial (III) practical skills II
对数据安全的思考(转载)
The difference and usage between continue and break
IP day 16 VLAN MPLS configuration
Hongliao Technology: Liu qiangdong's "heavy hand"
The latest 2022 review of "graph classification research"
High quality coding tool clion
Configuring OSPF GR features for Huawei devices
Function of activation function
[paper reading] nflowjs: synthetic negative data intensive anomaly detection based on robust learning
Linux regularly backs up MySQL database
10M25DCF484C8G(FPGA) AMY-6M-0002 BGA GPS模块
LeetCode 732. 我的日程安排表 III
Reading notes of effective managers
The usage and difference between strlen and sizeof
Introduction to promql of # yyds dry goods inventory # Prometheus
Understanding of processes and threads
How to use the container reflection method encapsulated by thinkphp5.1 in business code