Vue nextTick 为什么会出现?原理是什么?

作者: 程序员少北晨分类: 计算机技术 发布时间: 2023-03-25 18:33:54 浏览:8753 次

Vue nextTick 为什么会出现?原理是什么?

你好美啊嘿:
比如在一个循环里改变响应式数据一百次,那么是更新100次还是只更新最后一次,这就是为什么出现nextTick。原理就是当每次更新的时候是在调度器中将当前更新逻辑添加进一个微任务队列(同一个微任务只会存一次),然后在循环执行队头到队尾,当js执行完同步代码后就会执行异步代码了

【回复】你这回答有误,这只是nexttick里面的优化,不是主要作用。 实际上是作用于dom更新后的回调,是在生命周期里面去执行的
【回复】本质上就是更改回调函数的执行时机,不知道这样理解对不对
【回复】只要异步就行 。Promise.then、MutationObserver和setImmediate,setTimeout官方就是按照这个顺序 , 前两个微 , 后两个宏
层次111:
应该是promise.then()里面的代码才是异步任务

【回复】对的,promise本身是同步的,then是异步的
苦涩的黄油君:
其实就是dom异步更新机制 在dom更新任务后面加一个异步任务当执行完dom更新然后执行下一个异步任务也就是nexttick里面的回调 所以nextick本质是添加一个异步任务vue2做了平台兼容有多种添加异步任务的方式 vue3则是只有promise.then 整体来说就是考察vue的异步更新机制和js的时间循环机制

一心一意实事求是:
有些浏览器是什么浏览器不支持promise,还有几个正常的人用。

铁拳冲锋队长:
给不同页面的弹出框赋值的时候常用这个。因为弹出动画完成前,赋值赋不上,用延时器又不优雅,临时存储太蠢,用这个刚刚好。[doge]

【回复】你说的是不是,打开表格里某一行的表单,发请求填充数据后,会出现一段空白的问题?
菠萝阿菠萝蜜:
promisse是同步任务,但是他的then、catch方法是异步任务[吃瓜]

node老狗:
[吃瓜]没意义首先用到这玩意你就要考虑你代码是不是有问题了

【回复】这话说的显的你很菜鸟[doge]
【回复】回复 @一蓑烟雨任平生丶丶 : 只能说他写得少,或缺少需求的拷打
【回复】哪里听来这话的?这不是纯纯放屁[吃瓜]

程序员 原理 教程 前端 JavaScript 前端开发 Vue Web前端 科技猎手2023

如果觉得我的文章对您有用,请随意打赏。您的支持将鼓励我继续创作!