[Vuejs]-How computed in Vue tracks it's dependencies under the hood?

1👍

The computed fn accpets a function called ‘effect’ as the first input parameter, this fn usually contains reactive obj like ref()

When the computed fn is executed, the effect fn will be marked as "activeEffect", then this effect will be executed, it will trigger the reading of reactive obj。 Reactive obj use Proxy as an interceptor for reading and writing, this "activeEffect" will be collected into is dependency collection thought Proxy. When the reactive obj change, these effect will be taken out and executed.

Leave a comment