Диспетчерское действие за действием - PullRequest
0 голосов
/ 30 апреля 2019

У меня есть отдельные пользователи, для которых значение энтузиазма может быть увеличено / уменьшено.После этого я хочу обновить общий уровень энтузиазма (globalEnthusiasmLevel), а также сумму отдельных целых чисел энтузиазма (на пользователя).

У меня есть все, что мне нужно знать, чтобы обновить общее значение во время обработки отдельного значения (действие> редуктор), однако я хочу, чтобы это было отдельным действием для практических целей.

export function enthusiasm(state: StoreState, action: UsersAction): StoreState {

  let globalEnthusiasmLevel: number;

  switch (action.type) {

    case INCREMENT_ENTHUSIASM:

      state.users = state.users.map((user: UserType) => {

        if (user._id === action.payload._id) {
          user.enthusiasmLevel = user.enthusiasmLevel + 1;
        }

        return user;
      });

      globalEnthusiasmLevel = state.globalEnthusiasmLevel + 1;
      return { ...state, globalEnthusiasmLevel };

    case DECREMENT_ENTHUSIASM:

      const users: UserType[] = state.users.map((user: UserType) => {

        if (user._id === action.payload._id) {
          globalEnthusiasmLevel = (user.enthusiasmLevel > 0 ) ? state.globalEnthusiasmLevel - 1 : state.globalEnthusiasmLevel;

          user.enthusiasmLevel = user.enthusiasmLevel - 1;
          user.enthusiasmLevel = Math.max(0, user.enthusiasmLevel);
        }

        return user;
      });

      return { ...state, ...users, globalEnthusiasmLevel };

    case STORE_USERS:
      return { ...state, users: action.payload };

    case SET_GLOBAL_ENTHUSIASM:
      return { ...state, globalEnthusiasmLevel: action.payload };

    default:
      return state;
  } 
  1. Каков наилучший подход для отправки действия после действия?
  2. Разумно ли разделять STORE_USERS и SET_GLOBAL_ENTHUSIASM на другой редуктор?

1 Ответ

1 голос
/ 30 апреля 2019

1 - Вы можете написать промежуточное программное обеспечение для обработки побочных эффектов типа действий INCREMENT_ENTHUSIASM и DECREMENT_ENTHUSIASM. Следующий пример написан на ES6, поэтому вам нужно будет перевести на Typescript.

const middleware = store => next => action => {
  next(action);
  switch (action.type) {
    case INCREMENT_ENTHUSIASM:
      store.dispatch({
        type: INCREMENT_GLOBAL_ENTHUSIASM // increment global value
      });
      break;
    case DECREMENT_ENTHUSIASM:
      store.dispatch({
        type: DECREMENT_GLOBAL_ENTHUSIASM // decrement global value
      });
      break;
    default:
      break;
  }
}

...
import { createStore, combineReducers, applyMiddleware } from 'redux';

const store = createStore(
  combineReducers({
    enthusiasm
  }),
  applyMiddleware(middleware)
);

Но если globalEnthusiasmLevel можно рассчитать по уровням энтузиазма всех пользователей, то как насчет того, чтобы не хранить их в магазине, а рассчитать их в mapStateToProps, когда вместо этого нужно использовать компонент React? Вам будет легче.

2 - Если вы собираетесь хранить globalEnthusiasmLevel в другом редукторе, тогда да, так и должно быть. Но см. Мой пункт выше о том, что нужно не хранить, а вычислять.

...