TanStackT
TanStack10mo ago
33 replies
primary-violet

Handling defaultValues for a required number field

I know this is more of a general React issue than a TF-specific one, but I didn’t run into it with RHF since they don’t use controlled components by default.

I have a required amount field that should be a number. If I use z.number(), I run into the default value issue—I don’t want 0 (bad UX), "" isn’t assignable to number, and undefined causes React’s controlled/uncontrolled warning.

Would it be better to keep it as a string (""), then parse it before submission? Or is there a cleaner approach?
Was this page helpful?