const innerReducer = (state = {}, action) => ...
const outerReducer = (state = {}, action) => {
switch(action.type) {
case: 'SOME_ACTION':
return { ...state, someField: innerReducer(state.someField, action) }
case 'OTHER_ACTION':
return { ...state, someField: innerReducer(state.someField, { type: 'NEW_SHINY_ACTION', payload: 'some' }) }
}
}
</lang>
Вы можете вызвать другой редьюсер передав туда экшен. Причем можно даже передать другой экшен, но вы должны понимать, что это не то же самое, что и диспатч: эти экшены идут прямо в редьюсер и должны быть простыми объектами с полем type. При этом не нарушается концепция редьюсера - это все еще чистая функция, без side-effects.
class App extends Component {
constructor(props, context) {
super(props,context)
this.state = { items }
}
addSomethingToItems(newItem) {
// автоматически вызовет ререндер
this.setState({ items: [ ...this.state.items, newItem] })
}
...
render() {
return (
<div className="App">
<Selector ref="fruitSelector" items={this.state.items} />
</div>
);
}
}