Vue SFC Playground different watchEffect
results compared to local project
#11575
-
In the playground I see the following in my console: When running the same project locally I only see 3 console logs: The mutations in Vue: 3.4.37 Was hoping to see if someone could reproduce this before I open a bug report. I am expecting the same output as the playground, which is 5 console logs. |
Beta Was this translation helpful? Give feedback.
Replies: 1 comment
-
The local behaviour is correct. The code behaves differently in the playground because it monkeypatches the console.log calls, and in that code it stringifies the arguments to send it from the iframe to the parent playground app. So this is more of a playground bug than a Vue bug. So why is the local code correct? because your So when you change a specific object property or add an array item, the effect doesn't see a reason to re-run, because the effect's code never accesses those changed properties / Array items. |
Beta Was this translation helpful? Give feedback.
The local behaviour is correct. The code behaves differently in the playground because it monkeypatches the console.log calls, and in that code it stringifies the arguments to send it from the iframe to the parent playground app.
So this is more of a playground bug than a Vue bug.
So why is the local code correct? because your
watchEffect
s only depend on the value of the ref as a whole, not on any specific object property or array item.So when you change a specific object property or add an array item, the effect doesn't see a reason to re-run, because the effect's code never accesses those changed properties / Array items.