继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

el-tree加载完成后默认触发点击事件非默认选中(上)选中第一个节点点击

littlefox1221
关注TA
已关注
手记 2
粉丝 0
获赞 2

如果你浪费了自己的年龄,那是挺可悲的。因为你的青春只能持续一点儿时间——很短的一点儿时间。 —— 王尔德

前言

最近工作使用Vue+Element UI来进行开发,遇到部门树功能的时候选择了el-tree组件来展示,功能都完成了,但需要在加载完成后默认点击第一个节点,从而查询右侧对应的部门人员信息,但官方没有提供默认触发node-click事件,通过Google找到相关答案

效果图:
部门树
代码如下

watch: {
    // 根据名称筛选部门树
    deptName(val) {
      this.$refs.tree.filter(val);
    },
    // 默认点击Tree第一个节点
    deptTreeData(val) {
        if (val) {
            this.$nextTick(() => {
                document.querySelector('.el-tree-node__content').click()
            })
        }
    }
  },

通过watch观测对象值的变化,从而获取第一个节点的DOM元素,触发点击事件,相关issue

打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP

相关阅读

vue diff 算法