el-tree 默认选中第一个节点

html 复制代码
<el-tree
          ref="nodeTree"
          node-key="id"
          :data="treeData"
          :props="defaultProps"
          @node-click="handleNodeClick"
        >
</el-tree>
javascript 复制代码
export default {
  data() {
    return {
      defaultProps: {
        children: 'children',
        label: 'label'
      },
      treeData: [{
          label: '一级 1',
          children: [{
            label: '二级 1-1',
            children: [{
              label: '三级 1-1-1'
            }]
          }]
        }, {
          label: '一级 2',
          children: [{
            label: '二级 2-1',
            children: [{
              label: '三级 2-1-1'
            }]
          }, {
            label: '二级 2-2',
            children: [{
              label: '三级 2-2-1'
            }]
          }]
        }, {
          label: '一级 3',
          children: [{
            label: '二级 3-1',
            children: [{
              label: '三级 3-1-1'
            }]
          }, {
            label: '二级 3-2',
            children: [{
              label: '三级 3-2-1'
            }]
          }]
        }],
    }
  },
  watch: {
    treeData: {
      handler(val) {
        if(val) {
          this.$nextTick(() => {
            document.querySelector('.el-tree-node__content').click()
          })
        }
      },
      immediate: true
    }
  },
}
相关推荐
敲厉害的燕宝7 分钟前
Pinia——Vue的Store状态管理库
前端·javascript·vue.js
Aphasia31129 分钟前
react必备JavaScript知识点(二)——类
前端·javascript
珠峰下的沙砾41 分钟前
Vue3 里 CSS 深度作用选择器 :global
前端·javascript·css
前端_学习之路1 小时前
javaScript--数据结构和算法
javascript·数据结构·算法
拉不动的猪1 小时前
# 移动端与PC端全屏的处理
前端·javascript·面试
麦麦大数据1 小时前
vue+neo4j+flask 音乐知识图谱推荐系统
vue.js·mysql·flask·知识图谱·neo4j·推荐算法·音乐推荐
excel1 小时前
招幕技术人员
前端·javascript·后端
烛阴2 小时前
Promise无法中断?教你三招优雅实现异步任务取消
前端·javascript
GUIQU.3 小时前
【Vue】单元测试(Jest/Vue Test Utils)
前端·vue.js
前端张三3 小时前
vue3中ref在js中为什么需要.value才能获取/修改值?
前端·javascript·vue.js