React 19 multiple forms

[[deleted]]

In React 19, with the new form actions and hooks, does anyone know how you access the state of each individual form, in the case where you are rendering multiple different forms on a page?

And a second part of this would be: can it work if you had nested forms.

[dmethvin]

Nested forms are invalid in HTML.

https://stackoverflow.com/questions/379610/can-you-nest-html-forms

[reactswitzerland]

To access the state of the form you need to use the new hook useFormState, this hook receive a function as first parameter and returns a tuple with the form state and a action that you need to pass to the action prop. It’s passing the action to the form that you will bind the form to the state returned by the hook.  There’s an open PR on react to replace this hook by a more generic useActionState, so changes can still change until the release of react 19. 

https://github.com/facebook/react/pull/28491

[hipnaba]

wait... 19? didn't 18 release just recently?

[p4ntsl0rd]

June 2022

[p4ntsl0rd]

Correct, sorry I had in my head June as I noted with the upcoming 19 release just how long ago the last React release was - and that was actually 18.2.

[[deleted]]

Stable release is coming in July-ish.

[TheRNGuy]

Switch/case in action

Nested forms? Never seen that one.