This repository was archived by the owner on Oct 26, 2018. It is now read-only.
This repository was archived by the owner on Oct 26, 2018. It is now read-only.
Double location change pushing an url in action creator #429
Closed
Description
I've an Isomorphic app.
I'm experiencing a problem similar to #403 I tried to put in my package.json:
"react-router-redux": "dlmr/react-router-redux#fix-inital-server-load-dist",
but it is not working...
In my action creator I have:
export function formComplete(id, router) {
return (dispatch, getState) => {
dispatch(checkForm(id))
if (getState().registration[id]) {
return dispatch(formPassed(id, router))
}
}
}
The first action check that the page is completed and in that case a second action is dispatched:
export function formPassed(id, router) {
router.push('/registration')
}
Now I'm in an url that is /registration/login
. When I click to validate the form the two actions are dispatched in the correct order and finally my app redirects to /registration
.. But it automatically redirect a second time to registration/login
My client.js:
let preloadedState = window.__PRELOADED_STATE__
const persistedState = loadState()
if (persistedState != null) preloadedState = persistedState
const store = configureStore(preloadedState, browserHistory)
const rootElement = document.getElementById('app')
const history = syncHistoryWithStore(browserHistory, store)
store.subscribe(throttle(()=> {
saveState(store.getState());
}, 1000))
render(
<Provider store={store}>
<Router routes={ routes } history={ history }
onUpdate={() => { window.scrollTo(0, 0) }}
/>
</Provider>, rootElement
)
my server.js
function storeUpAndGo (sessionState, history) {
// setup of the Redux store
let preloadedState = { rootReducer }
const persistedState = loadState(sessionState)
if (persistedState != null) {
preloadedState = persistedState
}
// Create a new Redux store instance
return configureStore(preloadedState, history)
}
// This is fired every time the server side receives a request
const jsFile = parameters.chunks().javascript.main
const cssFile = parameters.chunks().styles.main
app.use(handleRender)
function handleRender(req, res) {
const memoryHistory = createMemoryHistory(req.url)
const store = storeUpAndGo(req.session, memoryHistory)
const history = syncHistoryWithStore(memoryHistory, store)
match({ history, routes, location: req.url }, (err, redirectLocation, renderProps) => {
if (err) {
console.error(err);
return res.status(500).end('Internal server error');
}
if (!renderProps) {
return res.status(404).end('Not found.');
}
const params = qs.parse(req.query)
const InitialComponent = (
<Provider store={store}>
<RouterContext {...renderProps} />
</Provider>
);
// Render the component to a string
const html = renderToString(InitialComponent)
// Grab the initial state from our Redux store
const finalState = store.getState()
// Send the rendered page back to the client
res.send(renderFullPage(html, finalState))
})
}
and finally my configureStore
export default function configureStore(preloadedState, history) {
const logger = createLogger();
const middleware = routerMiddleware(history)
const store = createStore(
rootReducer,
preloadedState,
compose(applyMiddleware(thunk, logger, middleware))
)
if (module.hot) {
// Enable Webpack hot module replacement for reducers
module.hot.accept('../reducers', () => {
const nextRootReducer = require('../reducers').default
store.replaceReducer(nextRootReducer)
})
}
return store
}
Metadata
Metadata
Assignees
Labels
No labels