2024年06月18日 建站教程
Vue.nextTick的作用不仅仅是保证操作DOM的机会,还可以应用在一些更复杂的场景中。例如,当您需要控制组件中的异步更新时,也可以使用函数。下面给大家简单介绍一下具体用法!
html语法
<div id="app">
<button @click="changeText">改变文本</button>
<div>{{ text }}</div>
</div>
javascript语法
new Vue({
el: '#app',
data: {
text: ''
},
methods: {
changeText: function () {
setTimeout(() => {
this.text = '新的文本'
console.log('文本已更改')
}, 0)
console.log('点击事件已触发')
}
},
watch: {
text: function () {
this.$nextTick(function () {
console.log('DOM更新完成')
})
}
}
})
本文链接:http://so.lmcjl.com/news/6811/