入侵网站做排名,十大必做调查网站,上海中小企业名录,谈谈对seo的理解[vue] 你知道nextTick的原理吗#xff1f;
提到DOM的更新是异步执行的#xff0c;只要数据发生变化#xff0c;将会开启一个队列#xff0c;并缓冲在同一事件循环中发生的所有数据变更。如果同一个 watcher 被多次触发#xff0c;只会被推入到队列中一次。简单来说#…[vue] 你知道nextTick的原理吗
提到DOM的更新是异步执行的只要数据发生变化将会开启一个队列并缓冲在同一事件循环中发生的所有数据变更。如果同一个 watcher 被多次触发只会被推入到队列中一次。简单来说就是当数据发生变化时视图不会立即更新而是等到同一事件循环中所有数据变化完成之后再统一更新视图。关于异步的解析可以查看阮一峰老师的这篇文章具体来说异步执行的运行机制如下。1所有同步任务都在主线程上执行形成一个执行栈execution context stack。2主线程之外还存在一个任务队列task queue。只要异步任务有了运行结果就在任务队列之中放置一个事件。3一旦执行栈中的所有同步任务执行完毕系统就会读取任务队列看看里面有哪些事件。那些对应的异步任务于是结束等待状态进入执行栈开始执行。4主线程不断重复上面的第三步。例子//改变数据
vm.message changed//想要立即使用更新后的DOM。这样不行因为设置message后DOM还没有更新
console.log(vm.$el.textContent) // 并不会得到changed//这样可以nextTick里面的代码会在DOM更新后执行
Vue.nextTick(function(){console.log(vm.$el.textContent) //可以得到changed
})个人简介
我是歌谣欢迎和大家一起交流前后端知识。放弃很容易 但坚持一定很酷。欢迎大家一起讨论
主目录
与歌谣一起通关前端面试题
