$nextTick

最新推荐文章于 2024-10-19 11:18:40 发布

sweet baby

最新推荐文章于 2024-10-19 11:18:40 发布

阅读量68

点赞数

本文链接：https://blog.csdn.net/weixin_47220950/article/details/116277762

版权

Vue.js $nextTick DOM更新事件循环回调函数

关键词由CSDN通过智能技术生成

$nextTick

简单说，因为DOM至少会在当前tick里面的代码全部执行完毕再更新。所以不可能做到在修改数据后并且DOM更新后再执行，要保证在DOM更新以后再执行某一块代码，就必须把这块代码放到下一次事件循环里面，比如

setTimeout(fn, 0)，这样DOM更新后，就会立即执行这块代码。//改变数据
vm.message = 'changed'

//想要立即使用更新后的DOM。这样不行，因为设置message后DOM还没有更新
console.log(vm.$el.textContent) // 并不会得到'changed'

//这样可以，nextTick里面的代码会在DOM更新后执行
Vue.nextTick(function(){
    console.log(vm.$el.textContent) //可以得到'changed'
})