Shall we use multiple combine reducers?

user_3153261 0
Viewed 4784

I have three reducers

  • Home
  • Listing
  • Detail

I have one combine reducer for above three. But I want to divide project structure into multiple reducers. Is it a good practice to have multiple combine reducer in the project?

react-redux redux reactjs
2 Answers

Yes, you can combine multi reducer and use it as one store,

  1. Firstly, you should import all reducers in a new file. then, combine all reducers with combine-reducer technics,like this:

    import { combineReducers } from 'redux'; import {Home,Listing,Detail} from '*/**';

    const rootReducer = combineReducers({ Home, Listing, Detail })

    export default rootReducer

  2. Secondly, import the new file in Store file and create your store with combined-reducer

    import { createStore } from 'redux' import rootReducer from '*/combinestores'

    const store = createStore(rootReducer) console.log(store.getState())optinal

    export default store

  3. In the end, in your container you can use your store like this : (but before it, you should be sure send store as props to Containers)

    const mapStateToProps = state => {

     return{
    *name of your var* :  state.Home.*,
    *name of your var* :  state.Detail.*  /*then you can use this var as props anywhere you need*/
 }

    }

    const mapDispatchToProps = dispatch => { return{

         *name of your var* : () => dispatch ( *name of your func*()),
     *name of your var* : () => dispatch ( *name of your func*())


 }

    }

    export default connect(mapStateToProps,mapDispatchToProps)(name of func);

user_107834610
Related