You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
As soon as temp.value >= 80 evaluates to true, the Javascript runtime will no longer evaluate the second condition (height.value >= 80)
Consequently, height.value isn't being accessed anymore,
and consequently, it no longer is a reactive dependency of the effect.
This is indeed a small footgun in watchEffect() due to how conditions are evaluated (or skipped) in JS.
another possible solution/workaround:
watchEffect(function(){console.log(">>>>>>>>>>",i++)// read all reactive depenencies outside of condition:constt=temp.valueconsth=height.valueif(t>=60||h>=80){console.log("触发警告",temp.value)}
I'll close this since it's not something we can solve in the implementation.
Vue version
3.4.21
Link to minimal reproduction
https://play.vuejs.org/#eNqNVFtPE1EQ/isn+9ISml4gIQTbxktI1Ac1SuLLvizb03Zhu7vZPVswpUnlZkEqEBQTICYk3DRgSjSkyMX/onu29Ym/4OyebbslBW0fejrzzTcz35kzBe6epoXzJuaGuDjBOU0WCE7yCkLxlJRHoiwYRoLnCDYIz7l28GT7kn+2Svbx9NX5Br1Ys6vf7drnxuUlLVcHor9mZ67Ol+zyOpitiwozD0bFnP3x5HdpurG/R5dX7cXdxtFePAJMbU6gogsVxgbMhQJyCkLFIlDeBIUMDJrFUiZLACzmPKyHHjUJURV0V5QlcRxaEbOCksEjwAwNsWS9sWg8wnDNHN2jHrpJWBxkvh4Xj4BmcIpHfEo637gh6pJGkAwkiQAxAsjAxNSQIuRwIjAC4r4kgpgdTqexSAIul5TTVJ2gAtJxOoQmBCJmvR+GQkWU1tUcCsDdBVizMiZMsYQTFIxFe+40zZ46zOHaHU/aVEQiQZttTYI9qMAkcJjCeUE2MepNoFjUsRa7xjFV2pEs2Q2xkUhHF/b6KT1fbvzcbGwv0Z0Nq/aFHn+yS/v1zVW6ctgsX4LKXRJfaLBVRTszkIuqYqgyDstqJggX1frwXAhJvb2hdlshf509jOAf0R4K0khpFPQplEyggai/jOtUbOxh5unqYozn2kQgi4+yQzogHfxv0r5rpK3zqJmBF4KsWol+3WjsvaZbByC6/e2DdbGG6HzFPtxuVGfq7w+s2tuOq4NXjABv1Sr12ZP60YJvIpKJgShdeecg6tOn9M2ZfxBo9RhigJmVZ/2Yb9UCW6FRmrOXFupz+9bZrlVbZKUgRMvzVm0Hrh9UoOUde/2IBXXTGU1Ndc5Yp1BdxsAvlHOVviHoYPIUvE3nznAvwL3EIvxx3j57662XT17J2Hv4hmg4T19UNZxKAtBxJbkQR8CkpKVMeMxQFVjEbiOwc9ScJslYf6o5Y27w3FCzRZ4TZFmdeOzaiA5tNO1iFovjXexjxqRj47lnOjawnsfQR9NHBD2DYas57uEXT/AknFvOnJoyZUDf4nyOQSvTqZHB7ptKCsr24dxqH7kbTVIyI8bwJMGK0WzKKdQV0MXzHGy0B7e03i63P9zvbZYiV/wLJOWgKw==
Steps to reproduce
`
需求:当水温达到60℃,或水位达到80cm时。触发报警
当前水温:{{ temp }}℃
当前水位:{{ height }}cm
点击【水温+10】5次后(temp.value >= 60),再点击【水位+10】,watchEffect方法内不触发
What is expected?
点击任意的按钮,都能触发watchEffect()
What is actually happening?
temp.value >= 60 为true后,点击changeHeight() 改变height.value 没触发watchEffect()
System Info
Any additional comments?
No response
The text was updated successfully, but these errors were encountered: