vue3:断点分析computed执行流程

384 阅读1分钟

1.定义计算属性时

Pasted Graphic 1.png

此时不会执行回调,只是创建了一个ComputedRefImpl实例

Pasted Graphic 2.png

2.第一次取值时,dirty为true,执行回调,同时把dirty改为false

Pasted Graphic 3.png

第二次取值dirty为false,直接返回值

Pasted Graphic 4.png

3.更改age—>age的trigger-->scheduler

Pasted Graphic 5.png

Pasted Graphic 6.png

Pasted Graphic 7.png

Pasted Graphic 8.png

代码附上:github