Question

我的个人用户的热情值可以提高/降低。在此之后，我想将整体热情水平（globalEnthusiasmLevel）更新为wel，即各个热情整数的总和（每位用户）。

在处理单个值时，我拥有更新整体值所需的全部知识（操作>归约器），但是出于实践目的，我希望将其作为单独的操作。

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;
  }

交战后派遣行动的最佳方法是什么？
将STORE_USERS和SET_GLOBAL_ENTHUSIASM分成不同的reducer是否明智？

Answer 1

1-您可以编写middleware来处理动作类型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，那么当您需要在React组件中使用时，不将它们存储在商店中，而是在mapStateToProps中进行计算呢？对您来说会更容易。

2-如果您打算将globalEnthusiasmLevel存储在不同的化简器中，那么它应该是。但是请参阅上面关于不存储而是计算的观点。

一个接一个地调度

1 个答案: