vue的$nextTick使用总结,this.$refs为undefined的解决办法,element Ui的树形控件setCheckedKeys方法无法使用

其实这3个讲的是一个问题,先说下问题,我在watch里设置一个监听,当弹窗打开时,自动添加树形的默认选中项,

但奇怪的是this.$refs为undefined,自然setCheckedKeys无法使用,这个时候就要用到$nextTick,不懂的朋友先去百度下,
大致来说就是一个虚拟dom变成真实之后的一个回调,只有在回调里面才能获取到$refs,问题自然就解决了

watch: {
    dialogVisible (val) {
      if (val) {
          this.setDefaultChecked()  // 如果为true。那么调用设置树形默认值的方法
      }
    }
  },
methods: {
    setDefaultChecked () {
      this.$nextTick(() => {
        this.$refs.Tree.setCheckedKeys(this.CheckedArr) // CheckedArr 一个选中的数组element Ui的东西,关键是看$nextTick的用法
      })
    },
}

总结一下,以后this.$refs为undefined的时候,不妨考虑下是不是真实dom还没有形成,可以用 this.$nextTick包裹一下试试,这也是 this.$nextTick我目前使用到的地方

posted @   爱吃巧克力的狗  阅读(23999)  评论(0编辑  收藏  举报
编辑推荐:
· SQL Server 2025 AI相关能力初探
· Linux系列:如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列(二):开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· 单线程的Redis速度为什么快?
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 展开说说关于C#中ORM框架的用法!
点击右上角即可分享
微信分享提示