本文主要是介绍Vuejs中的nextTick,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
问题:
当在父组件中onMounted函数中调用一些子组件的方法时,提示是undefined。 原因是mounted 不会承诺所有的子组件也都一起被挂载完成。
解决方法利用 nextTick 或者setTimeout
onMounted(()=>{//利用nextTick 延迟执行 同 setTimeout执行nextTick(()=>{dosomething();})//直接在这里面 使用 dlgCheckboxRef 有点问题。。。。。//有些东西还没挂载完// setTimeout(()=>{// dosomething();// },500)// https://segmentfault.com/a/1190000012861862
})
官网说明
当你在 Vue 中更改响应式状态时,最终的 DOM 更新并不是同步生效的,而是由 Vue 将它们缓存在一个队列中,直到下一个“tick”才一起执行。这样是为了确保每个组件无论发生多少状态改变,都仅执行一次更新。
nextTick()
可以在状态改变后立即使用,以等待 DOM 更新完成。你可以传递一个回调函数作为参数,或者 await 返回的 Promise
参考 javascript - Vue.nextTick 的原理和用途 - 个人文章 - SegmentFault 思否
参考 全局 API:常规 | Vue.js (vuejs.org)
这篇关于Vuejs中的nextTick的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!