watch: {// 根据名称筛选部门树deptName(val) {this.$refs.tree.filter(val); },// 默认点击Tree第一个节点deptTree(val) {if(val) {this.$nextTick(() =>{//this.$refs.tree.setCurrentKey('723fcc371a1c54ad53d899cf2c0f8c125d3951db899665a3be43700e354ebb4d');document.querySelector(".is-...
最近工作使用Vue+Element UI来进行开发,遇到部门树功能的时候选择了el-tree组件来展示,功能都完成了,但需要在加载完成后默认点击第一个节点,从而查询右侧对应的部门人员信息,但官方没有提供默认触发node-click事件,通过Google找到相关答案 效果图: 代码如下 watch: {// 根据名称筛选部门树deptName(val) {this.$refs...
1 打开一个vue文件，添加一个el-tree树形控件，设置值为多层级的数组。如图 2 在el-tree树形控件上添加node-expand事件，用于设置点击节点展开时在控制台上打印当前节点的内容。如图 3 保存vue文件后使用浏览器打开，按键盘上的F12打开控制台，点击节点内容为一级2 ，即可在控制台上看到打印出该节点内容。如图 ...
<el-radio-group v-model="radio" style="width: 100%"> <el-tree ref="elTree" node-key="uniqueId" :props="props" :data="elTreeData" :expand-on-click-node="false" highlight-current :filter-node-method="filterNodeMethod" default-expand-all @node-click="nodeClick" > <el-radio :t...
额，还有这种操作方式。
前面那篇选中默认节点,有朋友留言说能不能支持自定义节点,自己想了想认为可行,思路主要利用el-tree 的current-node-key和highlight-current属性,如图 <el-tree:data="deptTree":props="defaultProps":expand-on-click-node="false":filter-node-method="filterNode"current-node-key="723fcc371a1c54ad53d899cf...
以上即可实现自定义节点默认点击事件,核心在于$nextTick的使用,Vue官网说明:在下次 DOM 更新循环结束之后执行延迟回调。在修改数据之后立即使用这个方法,获取更新后的 DOM。
最近工作使用Vue+Element UI来进行开发,遇到部门树功能的时候选择了[el-tree](The world's most popular Vue UI framework)组件来展示,功能都完成了,但需要在加载完成后默认点击第一个节点,从而查询右侧对应的部门人员信息,但官方没有提供默认触发node-click事件,通过Google找到相关答案 效果图: el-tree 代码如下:...
最近工作使用Vue+Element UI来进行开发,遇到部门树功能的时候选择了el-tree组件来展示,功能都完成了,但需要在加载完成后默认点击第一个节点,从而查询右侧对应的部门人员信息,但官方没有提供默认触发node-click事件,通过Google找到相关答案 效果图: 部门树
前言 最近工作使用Vue+Element UI来进行开发,遇到部门树功能的时候选择了el-tree组件来展示,功能都完成了,但需要在加载完成后默认点击第一个节点,从而查询右侧对应的部门人员信息,但官方没有提供默认触发node-click事件,通过Google找到相关答案 效果图: 代码如下 ...