reactjs - Cum să ai combineReducers și reducători personalizați în Redux?
În prezent, toate reducer-ele mele au nevoie doar de datele din valoarea lor din stare, așa că 'rootReducer' arată astfel
export const appReducer = combineReducers({ foo: fooReducerFunction, bar: barReducerFunction})
ceea ce este în regulă, dar acum am un reducer care are nevoie de alte părți ale stării, și știu că se poate face așa
export function App(state: AppState, action: AppActions): AppState {
return {
foo: fooReducerFunction(state.foo, action),
bar: fooReducerFunction(state.bar, action),
baz: bazReducerFunction({foo: state.foo, bar: state.bar}, action)
}
}
dar nu vreau să trebuiască să scriu explicit toți ceilalți reducători așa cum am făcut cu foo și bar când doar o parte a magazinului meu are nevoie de alte părți ale magazinului. Există vreo modalitate de a combina reducători personalizați și combineReducers într-un mod de genul acesta?
const appReducer = combineReducers({ foo: fooReducerFunction, bar: barReducerFunction})
export function App(state: AppState, action: AppActions): AppState {
return {
...appReducer,
baz: bazReducerFunction({foo: state.foo, bar: state.bar}, action)
}
}
Răspuns #1
Este posibil să combini reducer-ele în acest fel, dar o soluție mai simplă la problema ta este să iei o captură a magazinului redux în acțiunea ta și să transmiți segmentul de stare de care ai nevoie reducer-ului tău la momentul dispatch-ului. Dacă folosești redux-thunk, de exemplu, următorul model ar trebui să funcționeze:
export const actionFoo = (data) => {
return (dispatch, getState) => {
// access slice of state first
const { otherStateSlice } = getState()
dispatch({ type: UPDATE_DATA, otherStateSlice, data })
}
}
