如何在ReactRedux中使用CombineReducer?并把Reducers的“ sate”对象合并为多个reduce

时间:2018-07-07 08:27:59

标签: reactjs redux react-redux redux-saga

我最近开始研究React Web开发应用程序,并开始在我的应用程序中使用react redux saga。所以问题是我创建了两个reduces reducer1 reducer2 并使用了 combineReducers ,但是状态没有发送回 propsToState 组件上的em>。

注意:如果我使用的是单个减速器,则效果很好

示例代码:

我的商店

// create the saga middleware
const sagaMiddleware = createSagaMiddleware();

const rootReducers = combineReducers({reduce1, reducer2})

// create a redux store with our reducer above and middleware
let store = createStore(
  rootReducers,
  compose(applyMiddleware(sagaMiddleware))
);



// run the saga

function* rootSaga () {
  yield all([
      fork(saga1),
      fork(saga2),
  ]);
}

sagaMiddleware.run(rootSaga);

我的减速器

// reducer with initial state
const initialState = {
    p1: false,
    p2: null,
    p3: null
  };

  export function reducer1(state = initialState, action) {
    console.log(state);
    switch (action.type) {
      case ACTION1:
        return { ...state, p1: true, p3: null };
      case ACTION2:
        const lState = { ...state, p1: false, p2: action.data };
        return lState;
      default:
        return state;
    }
  }

注意:和reduce2类似于reducer1

在我的组件上

const mapStateToProps = state => {
  return {
    loggining: state.loggining,
    user: state.user,
    error: state.error
  };
};

1 个答案:

答案 0 :(得分:1)

在获取映射到特定化简器的状态时,您缺少应该是化简器名称的键。

const mapStateToProps = state => {
  return {
    loggining: state.reducer1 .loggining, //add key reducer1
    user: state.reducer1 .user,
    error: state.reducer1.error
  };
};

请找到更多details here