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 @ 2019-04-09 10:08  爱吃巧克力的狗  阅读(23713)  评论(0编辑  收藏  举报