Discussion on: How does Reactivity work in Vue.js?

View post

Thanks for the Very clear explanation. Could you also explain how to handle nested components ( watchs).

Thank you :-)
Also, thank you for the suggestion of another good topic, I will surely write a post for that as well.
If any, you can tell me questions regarding this topic (Handling nested components) for which you need an in-depth explanation.

jianwu • Jul 12 '20

I'm a bit curious about how we handle "target" if there's a nested component. In your example, we put "target" as a global variable. That means only one target can be set at one time. But in the nested component. e.g. component A includes component B

watch(renderFunctionForA)

function readnerFunctionForA() {
  // render A.data
  watch(renderFunctionForB)
}

renderFunctionForB() {
  // Render B.data
}

In that case, I want the update of B.data() will only refresh renderFunctionForB(). How can we achieve that?