el-tree官网还有个current-node-key这个属性,这个只能在最初的时候(也就是写死的默认值)才可以设置上,但实际项目中会从后台拿到数据之后再去设置,这时候我们会this.currNodeKey = data.xxx;这样你会发现设置不上,也算是一个坑吧 所以我们要采用上面的方式: ① highlight-current(属性) ② setCurrentKey(方法)...
1.设置一个固定值作为key:node-key="id" 2.定义当前选中节点的key::current-node-key="currentId" <el-treenode-key="id":current-node-key="currentId":data="treeData":props="defaultProps":check-on-click-node="true":accordion="true"empty-text="组织机构"icon-class="":filter-node-method="fil...
el-tree设置导航树选中状态 setTreeCurrentKey (nodeKey) { if (nodeKey) { that.$refs.devTree.setCurrentKey(nodeKey) } else { that.$refs.devTree.setCurrentKey(null) } document.querySelector('.is-current') }, // 设置导航树节点选中 setTreeSelectNodeByKey (nodeKey) { // 延迟几秒执行 se...
可以单独选择父节点,选子节点时默认选中父节点,无半选状态。 效果: 代码: <template><el-treeref="tree":data="treeData"show-checkboxdefault-expand-allnode-key="id":props="defaultProps"check-strictly="false"@check="handleClick"></el-tree></template>exportdefault{data(){return{treeData:[{id:1,...
1.如果只需要改变样式,可以通过CSS来修改,隐藏checkbox 需要实现效果图 首先,查看checkbox元素所在的位置, 代码如下: #unSchTree.el-tree-node{ .is-leaf+ .el-checkbox.el-checkbox__inner{ display:none; } .el-checkbox.el-checkbox__inner{ display:inline-block; ...
需求:el-tree只能选中最后一层级的子节点,并且切换树内容时查找树的第一个无子节点的叶节点设置为选中状态 实现效果: 这里选中状态是蓝色高亮,灰色是hover效果 核心思想为el-tree通过 :current-node-key绑定一个选中值,然后通过el-tree的.setCurrentKey方法设置当前选中的值,不能够直接修改:current-node-key绑定的值...
需求 初始化默认选中根节点,后续点击则选中点击节点 思路 current-node-key的值设置为变量treeId,改变treeId的值,自动渲染 具体实现 HTML <e...
简介:VUE element-ui之el-tree树形控件勾选节点指定节点自动勾选(指定节点为必选项) 产品需求: 最后一级节点中列表节点为必选项 勾选列表节点之外的同级节点,列表节点自动勾选 取消列表节点勾选,其他同级节点也取消勾选(即列表节点为必选项) 列表之外的节点可单独操作(勾选或取消勾选) ...
js部分:用chooseNode: new Map()来存所有选中的节点,选中添加,取消移除。具体参照checkChange函数。 showTreeChecked函数也是重点 ,保证每次刷新数据的时候树节点都能把默认选中的数据置为选中状态。 此处本人用的是setCheckedKeys,当然官网也有setCheckedNodes,setChecked可以选择,setTimeout主要是为了保证异步渲染能正确...