element ui里面带勾选框的可以默认勾选上,这个没有勾选框 其实很简单。element ui的树形控件支持setCurrentKey()方法,只需要将你要设置的节点的key值设置进去就可以了,前提是要设置好node-key属性。然后在created()或mounted()钩子里写上代码就可以了。 <template><el-tree:data="data"ref="vuetree":props="...
使用el-tree组件的setCurrentKey方法,根据树组件的树节点的唯一id来制定某个树节点高亮。当然要搭配node-key="id"给树节点绑定唯一标识id,同时也要开启高亮模式(加上highlight-current属性),然后方式一设置高亮的颜色样式要加上。初始化加载默认高亮,所以在mounted钩子中书写代码即可。
this.$nextTick(() => {}) 配合写 this.$nextTick(() =>{this.$refs['myTree'].setCurrentKey(this.currentNodeKey) })
1. setcurrentkey 方法的基本用法 setcurrentkey 方法可以通过传入节点的 key 或者一个包含多个节点 key 的数组来设置树的当前选中节点。选中的节点会被高亮显示,并出发相应的事件。例如: ```javascript // 设置单个节点为当前选中节点 this.$refs.tree.setcurrentkey('node1'); // 设置多个节点为当前选中节点 ...
3.高亮节点必须 node-key="orgCode" 和 this.$refs.deptTree.setCurrentKey(this.dialogForm.deptCode); //设置选中,配置highlight-current后,即可高亮 4.计算当前高亮的位置 html <el-dialog:close-on-click-modal="false"title="修改部门":visible.sync="dialogVisibleDept"width="700px"@close="closeDialog...
主要就是这两行代码,需要注意的是setCurrentKey函数必须要放到$nextTick里面,要不然tree还未渲染上,是找不到popularTree的 this.currentLivingId=res.data[0].children[0].valuethis.$nextTick(function(){this.$refs.popularTree.setCurrentKey(this.currentLivingId)}) ...
elemet-ui的el-tree设置默认高亮无效 在给el-tree设置高亮的时候, 一直设置不上去,后因为一个小问题, 以免忘记,记录下: 1, 设置node-key 属性 2, 使用nextTick 3, 设置 highlight-current 属性 4, this.$refs.xxx.setCurrentKey('id名称') ......
需求 初始化默认选中根节点,后续点击则选中点击节点 思路 current-node-key的值设置为变量treeId,改变treeId的值,自动渲染 具体实现 HTML <e...
看看current-node-key在文档中的解释, 所以要想让节点高亮,就得设置这个key值 以上是默认高亮显示第一个节点,接下来看看setCurrentKey在文档中的解释 此处使用setCurrentKey方法的时候必须将其放在nextTick中,要等数据更新渲染完再调用,否则找不到对应元素,项目报错...