Нужно ли сохранять каждое свойство состояния компонента React в хранилище Redux? - PullRequest
0 голосов
/ 12 апреля 2020

Я прочитал несколько статей о необходимости использования Redux и создал два полнофункциональных приложения React + Redux. Я даже разместил вопрос на Quora У меня все еще не может быть окончательного ответа на мой вопрос:
Нужно ли сохранять каждое свойство состояния компонента в хранилище Redux?

Первый проект, который я создал, следуя руководству, в котором он в основном сохраняет все в магазине.
Вот ссылка Github .
С тех пор, как я изучал React и Redux, я не ставил под сомнение этот подход и продолжал его. Но, кажется, несколько ненужно сохранять все в хранилище
Например, есть действие, которое сохраняет данные комментариев в хранилище:

postActions. js

// Add Comment
export const addComment = (postId, commentData) => dispatch => {
  dispatch(clearErrors());
  axios
    .post(`/api/posts/comment/${postId}`, commentData)
    .then(res =>
      dispatch({
        type: GET_POST,
        payload: res.data
      })
    )
    .catch(err =>
      dispatch({
        type: GET_ERRORS,
        payload: err.response.data
      })
    );
};

И это называется так:

CommentForm. js

  onSubmit(e) {
    e.preventDefault();

    const { user } = this.props.auth;
    const { postId } = this.props;

    const newComment = {
      text: this.state.text,
      name: user.name,
      avatar: user.avatar
    };

    this.props.addComment(postId, newComment);
    this.setState({ text: '' });
  }

Если бы я работал над своим собственным проектом, я бы сохранил бы данные сообщения, хранящиеся локально на уровне компонента:

Вторым проектом был личный проект, где единственными данными, которые я сохранил в хранилище, является информация об учетной записи пользователя, потому что она мне понадобилась бы в другом компоненты во всем приложении, чтобы отправить его в некоторых запросах API к бэкэнду.
Все остальные компоненты в основном независимы, или поток между ними не превышает go двух или трех компонентов. Поэтому я действительно не мог понять, почему я заставляю себя кодировать все действия, редукторы ... и т. Д. c для всех компонентов. Таким образом, я просто передаю реквизиты и функции между компонентами простым старым способом реагирования.

Большинство ответов, которые я нашел, не go в эту конкретную c деталь, упомянутую в моем вопросе. Все они говорят с точки зрения высокого уровня.

Прежде чем приступить к работе над другими проектами, я хотел бы:

  1. Четкий ответ на мой вопрос
  2. Подход, который я использовал для моего личного проекта хорошо. Другими словами, могу ли я использовать Redux просто для информации учетной записи пользователя, а для остальных компонентов ее не использовать?

Я просто хочу устранить эту путаницу, чтобы при использовании Redux я Я уверен на 100%, что я им пользуюсь, потому что он мне действительно нужен.

1 Ответ

1 голос
/ 12 апреля 2020

Нужно ли сохранять каждое свойство состояния компонента в хранилище Redux?

Краткий ответ: Нет, не надо.

Более длинный ответ: Чтобы процитировать Дана Абрамова на похожий вопрос :

Используйте React для эфемерного состояния, которое не имеет значения для приложения во всем мире и не мутировать сложными способами. Например, переключение в каком-либо элементе пользовательского интерфейса, состоянии ввода формы.

Используйте Redux для состояния, которое имеет глобальное значение или изменено сложным образом. Например, кэшированные пользователи или черновик.

Нет ничего плохого в подходе, принятом в вашем личном проекте. Redux отлично подходит для хранения / публикации общего состояния приложения, такого как пользовательская информация, которую вы описываете.

Перед переводом состояния в Redux я спрашиваю:

  1. Будет ли это состояние использоваться другие компоненты, независимые от этого?
  2. Если ответ на вопрос № 1 - да, то спросите, как часто?
  3. Если ответ на вопрос № 2 - часто: тогда спрос - единственный источник правды (магазин Redux) лучший способ поделиться этим конкретным кусочком государства? Будут ли более подходящими другие методы (перехват / рендеринг реквизитов / компоненты более высокого порядка)?

Еще одна цитата Дана из той же связанной ветки:

Если это утомительно и разочарование не бойтесь поставить состояние в компоненты. Моя точка зрения заключается в том, что используйте одно дерево состояний, если это не неудобно, и делайте это только тогда, когда оно упрощает, а не усложняет. Это единственное руководство.

Мантра Яджни (Вам это не нужно) приходит на ум.

Если вы не уверены, следует ли государству быть абстрагированным от компонента в Redux, то, скорее всего, слишком рано делать это. Это помогает избежать принятия проектных решений слишком рано, в то же время сохраняя ваше состояние Redux бережливым и преднамеренным (то есть: не запутанным в ненужных проблемах одноразового использования).

В конечном итоге стоимость перевода состояния в Redux должна окупиться.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...