2020/12/10项目中遇到的关于$refs报undefined的问题
问题场景:
现在有一个父组件,一个子组件,通过点击父组件触发子组件的一个事件,通过
this.&refs.childrenRefs.function(),但是这个时候报错,子组件是一个弹窗,通过点击父组件来显示,但是点击的时候$refs下面拿不到childrenRefs组件的方法和数据。显示undefined.
查阅资料,原因是通过点击事件拿到子组件的refs,但是此时子组件还没有加载完成,所以就拿不到refs,出现这个问题的原因主要是在vue还没进行加载完方法的时候就开始进行执行组件方法就会报这个错误,解决的办法很简单,只要在让方法在vue加载完组件之后再进行执行就好了!
可以通过设置定时器setTimeout,或者this.$nextTick()
this.$nextTick(()=>{
this.$refs.children.function()
})
这个问题好像已经遇到过两次了。所以还是需要深入去了解一下,以上只是一些很浅显的东西,目前只是为了记录为什么会存在这种原因,以及如何解决。
刚刚查阅了有关ref