Subscribe on changes!

Computed prop sometimes not updating in nested component

avatar
Mar 10th 2021

Version

3.0.7

Reproduction link

https://codesandbox.io/s/reactivity-issue-demo-jbbme?file=/src/App.vue

Steps to reproduce

Please have a look at the minimal reproduction demo

What is expected?

All three (identical) components should behave identical

What is actually happening?

The second one doesn't update correctly


As requested I minimized the reproduction even more. The old link with more context still exists here: https://codesandbox.io/s/reactivity-issue-demo-h6mmz?file=/src/App.vue

(This more detailed demo is additionally emitting the selected tab, and this will cause the second - incorrectly rendered - component to update to a correct state as soon as the buttons inside the component are clicked)

avatar
Mar 11th 2021

same as #2768 #2829 caused by https://github.com/vuejs/vue-next/pull/2567

avatar
Mar 11th 2021

Indeed, but strictly speaking it is different from #2768 #2829, but very similar. The reason is that the update of the child component causes the parent component's renderEffect to be enqueued (the child component registers its own reactivity data to the parent component through the injected callback function, then the parent component's renderEffect may be enqueued when the child component updating), and finally invalidates the job that has been executed. This PR is necessary, while still, we should accept @edison1105 's changes