@webe

Как менять состояние isFetching внутри одного редьюсера?

Есть сущность пользователей, сейчас я могу выводить список пользователей и добавлять новых.
в будущем будет еще EDIT_USER_ , а так же DELETE_USER_
Хочу отметить что на каждый запрос нужен прелаудер, т.е. поле isFetching так как сервер отрабатывает небыстро.

в данном примере
1) используется один isFetching на все виды экшенов, что не есть хорошо.
2) исопльзуется 1 редьюсер для компактности кода. (что есть хорошо как по мне)

Как с точки зрения архитектуры сделать isFetching для каждого из экшенов?
Знаю что можно создать 6 редьюсеров и у каждого будет свой isFetching , но это ухадшит читаемость стора.
Можно оставить один редьюсер как сейчас и сделать isFetchingGetUsers isFetchingAddUser isFetchingEditUser isFetchingDeleteUser внутри одного редьюсера, но такой вариант тоже не очень хороший, у нас получается каша из разных названий полей

как быть? подскажите плиз.
Или все же нужно разделять на 6 редьюсеров?

const initialState = { isFetching: false, error: null, data: [] };

export default (state = initialState, { type, payload }) => {
  switch (type) {
    case 'GET_USERS_REQUEST':
      return { ...state, isFetching: true };
    case 'GET_USERS_SUCCSESS':
      return { ...state, isFetching: false, data: payload };
    case 'GET_USERS_ERROR':
      return { ...state, isFetching: false };

    case 'ADD_USER_REQUEST':
      return { ...state, isFetching: true };
    case 'ADD_USER_SUCCSESS':
      return { ...state, isFetching: false };
    case 'ADD_USER_ERROR':
      return { ...state, isFetching: false };

    default:
      return state;
  }
};
  • Вопрос задан
  • 62 просмотра
Решения вопроса 1
rockon404
@rockon404 Куратор тега React
Frontend Developer
Состояние коллекции пользователей лучше хранить в одном редьюсере.
Если в приложение подразумевается работа с одной активной сущностью, то для нее лучше сделать отдельный редьюсер. В этом случае может быть удобным использовать один ключ для редактирования, сохранения и удаления.
Если подобные ключи нужны для работы с коллекцией, например быстрое редактирование, добавление и удаление в таблице. То можно использовать коллекцию состояний:
{
  isFetching: {
    'ALL': false,
    '122bc-e43gf-24002-12ea1-ca785': true,
  },
}

Где всегда есть свойство для всех сущностей и опционально добавляется для нужных элементов по id.
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы