在vue中使用this.$refs报错undefined找不到子组件的方法

最近遇见个问题在父组件调用子组件的方法时报错undefined这种情况一般都是父组件调用子组件方法的时候，子组件还未渲染成功比如报错行是this.$refs.passwordmodal.show(username);可以改成上this.$nextTick(()=>{this.$refs.passwordmodal.show(username);})...

不知名码农_

5818人浏览 · 2021-02-22 16:30:21

不知名码农_ · 2021-02-22 16:30:21 发布

最近遇见个问题在父组件调用子组件的方法时报错undefined
这种情况一般都是父组件调用子组件方法的时候，dom还没更新成功
可以使用 this.$nextTick
这个方法作用是当数据被修改后使用这个方法会回调获取更新后的dom再渲染出来
比如我要调用子组件passwordmodal的show方法

  this.$refs.passwordmodal.show(username);

可以改成上

      this.$nextTick(()=>{
          this.$refs.passwordmodal.show(username);
        })

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^