kriasoft / universal-router

A simple middleware-style router for isomorphic JavaScript web apps
https://www.kriasoft.com/universal-router/
MIT License
1.7k stars 103 forks source link

Question: save url params in redux store and don't render previous connected route with the new params #43

Open hackhat opened 8 years ago

hackhat commented 8 years ago
// Let's say we have these 2 routes:

// `/home/:myValueA` route
async action(args) {
  args.context.store.dispatch({type: 'onRouteEnter', params: args.params});// or
  return (
    <Home />
  );
},

// `/other/:myValueB` route
async action(args) {
  args.context.store.dispatch({type: 'onRouteEnter', params: args.params});
  return (
    <Other />
  );
},

// Let's say we are in the `/home` route
// and we navigate to the `/other` route.
// The problem is that when it enters the `/other` route it dispatches the `onRouteEnter` action;
// The reducer will save the `params` in the store;
// Now the `<Home/>` component is connected to the store so it will render again and
// will get the new `params` value; <-- this is the problem, because sometimes is not what we want.
// After that the `<Other />` component is rendered and will use the new `params`;

// Question: How do you solve this issue? How do you make sure `<Home/>` component is not called with
// the `params` of the `/other` route?

One of the reason that I would prefer to keep it in the store is because you can use time travel with redux devtools. If you do like in your example, the url doesn't change when the you go back in the redux devtools timeline.

--- Want to back this issue? **[Post a bounty on it!](https://www.bountysource.com/issues/38300428-question-save-url-params-in-redux-store-and-don-t-render-previous-connected-route-with-the-new-params?utm_campaign=plugin&utm_content=tracker%2F18115217&utm_medium=issues&utm_source=github)** We accept bounties via [Bountysource](https://www.bountysource.com/?utm_campaign=plugin&utm_content=tracker%2F18115217&utm_medium=issues&utm_source=github).
langpavel commented 7 years ago

From the outer world: There is redux-router package for usage with react-router. If you digg in, you will see there is much work to correctly synchronize navigation and store. I'm afraid this is out of scope of univarsal-router.

ghost commented 7 years ago

+1 if this support can be enabled (possibly as a separate addon)