Redux - 使用combineReducer时指定action.type中的哪个reducer

时间:2017-01-04 03:53:05

标签: javascript reactjs redux

所以我有一个减速器:

const buttonReducer = (state = { buttons: [] }, action) => {
    switch(action.type)
    {   
        case "add":
        {   
            state = { ...state, buttons: [...state.buttons, action.payload] }
            break;
        }   

        case "minus":
        {   
            state = { buttons : state.buttons.filter( item => item !== action.payload ) } 
            break;
        }   
        default:
            break;
    }   
    return state;
};

现在说我有另一个类似于此的reducer(我们称之为componentReducer),只是改变了案例中的代码。现在我如何指定在完成combineReducers后应该使用哪个减速器?

const reducers = combineReducers({
    component: componentReducer,
    button: buttonReducer
});

store.component.dispatch(...)会有效吗?或者我应该只是简单地重命名案例?

连接:

const Search = connect(
    (store) =>  
    {   
        return { number: store.component.number};
    }) (SearchComponent);

1 个答案:

答案 0 :(得分:1)

如果要对这两个Reducer使用相同的调度操作名称,可以使用第三个变量来调度dispatch({action: 'add', reducer: 'button', payload: {..your data goes here..}})。然后你还需要为你的reducer添加一个条件:

const buttonReducer = (state = { buttons: [] }, action) => {
  if(action.reducer == 'button'){
    switch(action.type){
      ... your code goes here ...
    }
  }

虽然您可以执行上述操作,但我建议您远离该解决方案并坚持根据他们的确切操作来命名您的调度操作,例如:ADD_BUTTONADD_COMPONENT而不是{ {1}}。