WARNING
本页面文档暂未更新
$nextTick()
nextTick
是 Vue.js 的一个异步API,用于在 DOM 更新之后执行一段延迟的操作。在 Vue.js 中,当修改数据后触发数据更新,但是 DOM 并不会立即更新,而是加入到异步队列中,在下一个时间片去更新 DOM。
nextTick
用于在 DOM 更新后执行一些操作,避免出现数据更新后立即去访问 DOM 却得不到最新的值的问题。例如,在使用 $refs
访问父子组件中的 DOM 元素时,常常需要在 DOM 完全更新后才能正确访问。
html
<script>
export default {
created() {
this.$nextTick(() => {
console.log('渲染完毕之后执行')
})
}
}
</script>
<script>
export default {
created() {
this.$nextTick(() => {
console.log('渲染完毕之后执行')
})
}
}
</script>
Vue.js 还提供了类似的异步API,例如 $nextTick
和 $forceUpdate
等。 $forceUpdate
则是用于强制更新组件的,它会触发组件的重新渲染。
- element刷新表单校验和值
js
this.$refs["formName"].resetFields();
this.$refs["formName"].resetFields();
- Vue强制刷新页面内容
js
this.$forceUpdate()
this.$forceUpdate()
- Element表格部分数据变化,重新渲染tableData
js