el-tree 自动勾选功能实现
在 el-tree 中，同一层级下的节点可以勾选。本文将介绍如何在满足一定条件时自动勾选其他节点。
需求分析
解决方案
在 check-change 事件中进行判断并处理：
const handleCheckChange = (data, checked) => {
const [type, index] = data.label.split('-');
const checkedNodes = treeRef.value.getCheckedNodes();
// x-n被勾选，且x-0没被勾选，则勾选x-0
if (checked && index !== '0' && !checkedNodes.some(it => it.label === `${type}-0`)) {
treeRef.value.setChecked(`${type}-0`, true);
}
// x-0取消勾选，且有x-n被勾选，则重新勾选x-0
if (!checked && index === '0' && checkedNodes.some(it => it.label !== `${type}-0` && it.label.startsWith(`${type}-`))) {
treeRef.value.setChecked(`${type}-0`, true);
}
}这段代码首先根据节点标签中的横杠（-）来拆分出类型（type）和索引（index）。然后检查勾选状态以及是否满足自动勾选的条件。
代码实现效果如下：
以上就是el-tree自动勾选：如何实现父子节点间的联动勾选？的详细内容，更多请关注php中文网其它相关文章！
每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。
广告![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
351
