final-form / react-final-form

🏁 High performance subscription-based form state management for React
https://final-form.org/react
MIT License
7.39k stars 481 forks source link

Maintaining complete form state after unmount #992

Open made-in-nz opened 2 years ago

made-in-nz commented 2 years ago

Are you submitting a bug report or a feature request?

Feature request

What is the current behavior?

I'm migrating our front-end infrastructure from redux-form, where we have projects with multiple forms with destroyOnUnmount={false} set on the (redux-form) Form. In my apps we have wizard type processes, and other CRUD type apps where a record is displayed across multiple tabs with a form used on each tab. To easily visualise a page/tab's validation state I find it convenient to have distinct forms for each. In redux-form, the complete form state persists in the redux store when destroyOnUnmount={false} is set, which means when remounting the form component the complete state is rehydrated (visited, touched, error, etc).

Wondering what is the approach to achieve this using react-final-form?

What's your environment?

"final-form": "^4.20.7",
"react": "^18.1.0",  
"react-dom": "^18.1.0",
"react-final-form": "^6.5.9",
georgiosd commented 9 months ago

For our wizards, I keep every step mounted and only show the relevant form.

I guess you could also use a spy to save the state somewhere else.