Save an in-progress form
Allow your end users to pick up where they left off
Use this pattern when a multi-step form should remember the user's progress after refresh or return visits.
Save both the current step and the current form values to app state.
Build the form
- Add a create form
- Split it into multiple form steps
- Add back and next buttons for navigation
Save progress
- Update the step value in app state when the user moves between steps
- Persist the step value
- Save the current form values to a separate state key
- Persist the form values
Restore progress
- Bind the form's initial step to the saved step state
- Bind each field's default value to the saved form state
- Clear the saved state after submission
Why this works
The step state restores where the user was, and the form value state restores the entered values.
App export
Updated 4 months ago
Did this page help you?