redux-immutable 和 initialstate

Question

我对使用 redux、redux-immutable 和 immutablejs 的 React 应用程序中的状态发生了什么感到困惑。

我的减速器是这样的：

export const initialState = Map({
  isFetching: false,
  forecast: List()
});

export function forecast(state = initialState, action) {
  switch(action.type) {
  case ActionTypes.FORECAST.REQUEST:
    return state.merge({
      isFetching: true
    });
  case ActionTypes.FORECAST.SUCCESS:
    return state.merge({
      isFetching: false,
      forecast: action.response
    });
  case ActionTypes.FORECAST.FAILURE:
    return state.merge({
      // isFetching: false
    });
  }

  return state;
};

export function errorMessage(state = null, action) {
  const { type, error } = action;

  if (type === ActionTypes.RESET_ERROR_MESSAGE) {
    return null;
  } else if (error) {
    return {errorMessage: action.error};
  }

  return state;
};

export default combineReducers({
  forecast,
  errorMessage,
  routing: routerReducer
});

以下是我创建商店的方式：

  import reducers from '../reducers';
  const initialState = Map();

  const store = createStore(reducers,
                            initialState,
                            compose(
                              applyMiddleware(
                                thunkMiddleware,
                                logger
                              )
                            ));

在连接的组件中，我将此函数传递给连接：

function mapStateToProps(state) {
  return {
    forecast: state.get('forecast'),
    isFetching: state.get('isFetching')
  };
}

export default connect(mapStateToProps, {
  fetchForecast
})(Forecast);

但是如果我查看正在传递到 mapStateToProps

的状态

它似乎是由我结合以下代码的 3 个 reducer 组成的映射；

export default combineReducers({
  forecast,
  errorMessage,
  routing: routerReducer
});

我可以将 mapStateToProps 中的代码更改为：

function mapStateToProps(state = state.get('forecast')) {
  return {
    forecast: state.get('forecast').get('forecast'),
    isFetching: state.get('forecast').get('isFetching')
  };
}

但这感觉不对。为什么我的状态是由 3 个 reducer 组成的，而不是我在这里指定的初始状态：

export const initialState = Map({
  isFetching: false,
  forecast: List()
});

export function forecast(state = initialState, action) {
  switch(action.type) {
  case ActionTypes.FORECAST.REQUEST:

Answer 1

Redux 的 "combineReducers" 方法获取多个切片的状态并将它们组合成一个状态。它在这里工作正常。

您的 initialState 正在每个单独的减速器中使用，并正在设置总体状态的那些切片的初始状态。不是整个组合减速器的初始状态。

您拥有的代码将创建一个初始状态：

{
    forecast: {
        isFetching: false,
        forecast: List()
    },
    errorMessage: null,
    routing: //not shown in code provided
}

相反，如果您希望预测从 "List()" 的初始状态而不是对象开始，您应该在此处更改传递给预测减速器的初始状态；

export function forecast(state = List(), action) {

然后为 "isFetching" 创建一个单独的减速器，如果你想让它成为预测的同行。

redux-immutable 和 initialstate

redux-immutable and initialstate

reactjs

immutable.js

redux