redux - async reducer with react-router seems to have multiple stores? -
i have async reducer structure. on given page, inject page's reducer with:
export const injectreducer = (store, { key, reducer }) => { // store.asyncreducers initialized {} // makerootreducer returns combinereducers({...store.asyncreducers}) store.asyncreducers[key] = reducer store.replacereducer(makerootreducer(store.asyncreducers)) }
i use react-router 3
, plain routes definitions on given page. use require.ensure
async handling of routes within getcomponent
of plain route definition:
export default (store) => ({ path : 'counter', getcomponent (nextstate, cb) { require.ensure([], (require) => { const counter = require('./containers/counter').default const reducer = require('./modules/counter').default injectreducer(store, { key: 'counter', reducer }) cb(null, counter) }, 'counter') } })
my problem if use dispatch
followed browserhistory.push
, expect state gets updated before going new page. happens however, there appears 2 separate stores. example, navigating between pages, value of counter previous page seems preserved despite being on same key. going on here???
sample repo of problem. can git clone
, npm install
, npm start
, go localhost:3000/counter
. if click double (async)
doubles counter , goes /otherpage
. if click half (async)
bring /counter
. value of counter value doubling
, not halving
. also, importantly, pulling redux devtools
, navigating between pages seems show counter change data before. if entire store replaced, yet prior values preserved.
what going on here???
after investigation have discovered in development reduxdevtools recompute entire state history on new page. inserting new reducer initialstate different on new page results in 2 different results. there not 2 stores or caches, redux dev tools recomputing entire state history different initialstates.
hence in scenario, dispatch updating state on first page. browserhistory makes push go second page. second page recomputes entire state history. second page has reducer missing action handler first page. hence when recomputing entire state history, state doesn't change last action.
Comments
Post a Comment