老师请问一下关于异步更新
来源：2-8 update
hy_wang
2020-10-08
老师请问一下之前我一直理解是Vue中的异步更新是按照一次Event Loop中去执行的，就好比同步逻辑执行完毕之后关于微队列（比如Promise）也同时执行完毕后才开始重新渲染页面。可是事实好像并不是这个样子，请问一下老师Vue中的页面更新时机究竟是怎么一回事？
请问下不是按照这张图进行的异步更新原理吗？
就比如这段代码
```
setup() {
setup() {
const data = ref(0)
onMounted(() => {
data.value = 3
// 此时页面并不会更新
debugger
data.value = 4
// 也不会更新
debugger
// 页面此时
await new Promise((res) => res)
// 页面更新了 data的值在Dom上已经变成了4了
data.value = 5;
await new Promise(res => res)
})
}请问一下老师能稍微解释一下吗，不是特别明白。我的理解是不应该等待同步代码执行完毕后然后在执行完所有的micro然后才进行页面更新吗。为什么就已经变成4了
写回答
3回答
-
前端工程师666777888
2021-04-01
await new Promise((res) => res) 这是什么意思 你怎么把res给返回了
res应该是个函数啊，resolve函数。你只有执行了res() 才会执行await下面的语句
00 -
前端工程师666777888
2021-04-01
async await是成对出现的，为什么你的代码中只有await
00 -
ustbhuangyi
2020-10-08
因为两个 await 创建了两个 promise，这两个 promise 并不是在一个 tick 内一起创建的，第二个是在第一个执行完毕后才创建的，所以会在第一个 promise 执行完毕后，页面刷新了一次，然后这个时候才开始创建第二个 promise。
022020-10-09
相似问题