M
M
minority2019-05-20 19:56:05
JavaScript
minority, 2019-05-20 19:56:05

React + redux which state structure to choose for form and component?

I am doing the first project on react and the question arose of how to do it right, because different approaches are used everywhere.
There are pages (part of the state is the same for everyone):
Authorization
Registration
Password recovery
For example, for the registration page, I made such a global state

const initialState = {
  isSuccess: false,
  isLoading: false,
  isError: false,
  errorMessage: ""
};

An action is called on form submission
export const signupRequest = formData => async dispatch => {
  try {
    dispatch(signupRequestProcess());

    const data = await api("post", "auth/signup", formData);

    dispatch(signupSuccess(data));
  } catch (error) {
    dispatch(signupRequestError(error));
  }
};

At the same time, I omitted onChange in the form component, and the state property for the form fields, because the forms are not large and considered unnecessary (maybe I'm wrong), the ui library provides validation.
I saw more examples with articles inside the component, but then part of the logic needs to be written in the component itself, here I just call dispatch, otherwise I have to write response processing in the component, which is not very beautiful in my opinion.
What would be the optimal structure and approach for such forms?

Answer the question

In order to leave comments, you need to log in

2 answer(s)
R
Robur, 2019-05-20
@minority

That's why different approaches are used everywhere because there is no one "correct" one.
Write as you like, and over time, in each case, you will understand how to do better.
You can, like you, you can put a state in the component, change the flag from true to false is not so much logic.

D
Dmitry, 2019-05-20
@dimoff66

const initialState = {
  isLoading: false,
  errorMessage: ""
};

This is enough to calculate isSuccess and isError

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question