-
-
Notifications
You must be signed in to change notification settings - Fork 520
Description
Describe the bug
After updating "@tanstack/vue-form" from 1.2.4 to 1.19.5, watchEffects
used to update other values via setFieldValue
triggers an infinite loop.
Here is a reproduction: https://stackblitz.com/edit/vitejs-vite-9fd8xe5a?file=src%2FApp.vue&terminal=dev
You should input 1
and blur the first input to trigger it (with the console opened, you will have debuggers, so your tab will not explode from the infinite loop)
Some discoveries:
Putting { dontValudate: true }
to the setFieldValue
options solves the issue
Also using a watch
instead of a watchEffect
works as workaround, even watching the setFieldValue
watch(() => [store.value, form.setFieldValue], ([v, setFieldValue]) => {
console.log("store", v)
if (v['first'] === "1") {
setFieldValue('second', '2')
}
}, {onTrack(e) {
debugger
},
onTrigger(e) {
debugger
},
})
Your minimal, reproducible example
https://stackblitz.com/edit/vitejs-vite-9fd8xe5a?file=src%2FApp.vue&terminal=dev
Steps to reproduce
You should input 1
and blur the first input to trigger it (with the console opened, you will have debuggers, so your tab will not explode from the infinite loop)
Expected behavior
As a user, I expected the watchEffect to trigger once, instead of causing an infinite loop
How often does this bug happen?
Every time
Screenshots or Videos
No response
Platform
- OS: Mac OS 15.5
- Browsers: Chrome 139.0.7258.157, Safari
TanStack Form adapter
None
TanStack Form version
1.19.5
TypeScript version
11.5.1
Additional context
No response