前俩天在看 Vue3 的代码的时候看到了eddect.ts
中一段奇怪的代码,我寻思着这不是在脱裤子放屁吗?
export function triggerEffects(
dep: Dep | ReactiveEffect[],
debuggerEventExtraInfo?: DebuggerEventExtraInfo
) {
// spread into array for stabilization
const effects = isArray(dep) ? dep : [...dep]
for (const effect of effects) {
if (effect.computed) {
triggerEffect(effect, debuggerEventExtraInfo)
}
}
for (const effect of effects) {
if (!effect.computed) {
triggerEffect(effect, debuggerEventExtraInfo)
}
}
}
经过搜索发现在这么写是有原因的: https://github.com/vuejs/core/issues/5720
这个 issues 展示的列子显示computed
没有在正确的时机计算结果。
后续 Vue 官方修复了这个问题。
但是我还有一个问题: SFC 链接
如果使用 3.2.33(#5720 修复前的版本)执行上述 SFC ,得到的结果是
computed count: 0
before inc plusOne: 1
watch count: 1
watch plusOne: 1
computed count: 1
after inc plusOne: 2
可以看到watch plusOne
的值是错误的,当然这个问题已经解决了。
如果使用最新的版本,那么顺序是
computed count: 0
before inc plusOne: 1
computed count: 1
after inc plusOne: 2
watch count: 1
watch plusOne: 2
看起来结果正确了,但是watch
的位置却在after inc plusOne
之后了?
这是预测的行为吗? 个人觉得这引入了一个新的问题。。但是由于我的水平有限,无法理清内部原理,所以无法确定这是不是正常的。
这个可能和 Vue 的scheduler
有关?
这是一个专为移动设备优化的页面(即为了让你能够在 Google 搜索结果里秒开这个页面),如果你希望参与 V2EX 社区的讨论,你可以继续到 V2EX 上打开本讨论主题的完整版本。
V2EX 是创意工作者们的社区,是一个分享自己正在做的有趣事物、交流想法,可以遇见新朋友甚至新机会的地方。
V2EX is a community of developers, designers and creative people.