问题:在很多情况下,第一次获取ref会失败,但是第二次会成功。
在element-ui中弹框中的表格中绑定了ref ,点击按钮开启弹框并且获取ref这个时候就会失败代码如下:
![9320442-2016c03081840786.png](https://i-blog.csdnimg.cn/blog_migrate/45e8a2ecc7e8e7e533b20a4b3d76a373.png)
image.png
失败原因:弹框开启时DOM还没有完全加载完成,所以会导致第一次获取不到ref
解决方法:
- 第一种(推荐)
this.$nextTick(()=>{
....
})
![9320442-56f96d57c71f0678.png](https://i-blog.csdnimg.cn/blog_migrate/dad55bf3812e044d186846e6f98ea587.png)
image.png
-第二种:使用时间函数,延迟
setTimeout(()=>{
...
})
![9320442-c84110cb269beb84.png](https://i-blog.csdnimg.cn/blog_migrate/e60ce244dd905d1cdae6107bc4d8e0f9.png)
image.png
综上所述,两种方法都可以解决Dom节点没有加载完全导致的ref获取不到哈~~推荐第一种哈
PS:喜欢的点个小星星吧,不喜欢也点一下哈,嘿嘿