element-ui tree 点击章节节点勾选/取消勾选

遇到一个需求，要求点击tree组件的章节时(不是点击checkBox)，要进行节点勾选/取消勾选操作；
原本想的方案非常复杂，涉及到遍历父子节点，且要考虑到底是勾选还是取消勾选，还有父节点的半勾选状态等（废话不多说了，懂的都懂）。。。。
超简单实现方案 ------ 直接上代码

在tree的 node-click 事件里

<script>
methods: {// 点击章节节点勾选/取消勾选nodeClick(data, node, el) {const treeitem = el.$el;const checkbox_input = treeitem.childNodes[0].childNodes[1].childNodes[0];checkbox_input && checkbox_input.click();},
}
</script>

已测试，没毛病

总结

回归到了操作 dom 节点的方式，找到属于点击章节的checkbox，添加点击事件；
有时候不要把问题想的太复杂（我说的我自己）；

以上作废，我错了，我是小丑

check-on-click-node 加上这个属性就行了

element-ui tree 点击章节节点勾选/取消勾选相关推荐

Element ui tree树形控件获取当前节点id和父节点id
低版本Element ui tree树形控件获取当前节点id和父节点id的方法:点击查看最新版本Element ui tree树形控件获取当前节点id和父节点id教程: 1.找到node_modul ...
修改element ui tree 搜索功能，实现分级搜索，关键字高亮
element ui 里面的tree 自带的搜索功能是默认搜索的全部数据,有关键字的显示,没有的不显示需求: 在element UI tree 原有功能不变的情况下新加 1)搜索 tree 时,如果 ...
vue element ui下拉菜单和不是table列表全选功能问题解决方案
这半个月都在折腾vue的项目,虽然不是很复杂,但对于刚入门的小白来说,踩到的坑不少,常常因为一个小问题就得浪费好久问题,不过娃不在身边,晚上和周末可以继续研究,趁睡觉前,把今天遇到的问题给总结一下,做 ...
JQuery中checkbox勾选/取消勾选的诡异问题（attr和prop）
#1.使用attr()实现勾选的问题 //HTML伪代码 <form>你爱好的运动是?<input type="checkbox" id="Checke ...
QAbstractItemView子类如:QTreeView、QTableView等子项单元格复选框勾选/取消勾选功能实现
1.前言本博文所说的技术点适用于同时满足下面条件的所有QAbstractItemView视图类的子类: 模型类从 QAbstractItemModel派生. 代理类从QStyledItemDeleg ...
element ui tree树节点数据平面化
有时候需要对树节点进行增删改查,因此需要快速找到要操作的这个节点.将label,children格式的数据平面化处理后,可以根据id等唯一标识字段快速定位节点,随后对其操作. 数据平面化操作: fun ...
element tree 点击某个节点，获取该节点的所有子节点的id
html中 <el-tree :data="list" :props="defaultProps" @node-click="handleNod ...
element UI dialog点击dialog区域外会关闭dialog
需求描述今天,在做Element+Vue项目时遇到一个需求:甲方要求在Dialog打开状态下,点击该Dialog以外的区域会导致该Dialog关闭:正确的状态应该是只有在点击关闭按钮,或者是Dial ...
element ui tree结构双击单机右键事件
<el-tree:data="data":props="defaultProps"@node-click="handleNodeClick&qu ...

element-ui tree 点击章节节点勾选/取消勾选

总结

以上作废，我错了，我是小丑

element-ui tree 点击章节节点勾选/取消勾选相关推荐

最新文章

热门文章