How to properly complete the task?

Question

React

I'm completely green guys, so don't scold me)
How to correctly execute this moment in architecture on React.
There are 4 forms. I filled in one, clicked on, filled in another, clicked on .... As a result of which, after filling out all the forms. On step 4, you click to register and all data is sent in one request.
I really need it guys, please help!!!

Answer 1

Pretty trivial task.
I recommend doing it through redux, but you can do the same thing through a regular state.
Organize the data model

{
  step: 1, // текущий шаг, по умолчанию будет первый
  name: '', // и остальные поля для заполнения.
  phone: '',
  ...
}

after each click on "next" you make a check that the current fields are validly filled in and make the transition to the next step. Depending on the step, you show the necessary components.
At the last step You send the current completed data to the server.

Answer 2

See how the stepper component in material-ui is done. Or just use it