react-router-redux

Currently I pre-load data from api in container component's lifecycle method componentWillMount: componentWillMount() { const { dept, course } = this.props.routeParams; this.props.fetchTimetable(dept, course); } It is called when user navigates to route /:dept/:course , and it works fine, until you navigate from let's say: /mif/31 to /mif/33 and then press back button. The component is not actually reinitialized, so the lifecycle method is not called, and the data isn't reloaded. Is there some sort of way to reload data in this case? Should I maybe use another method of preloading data? I see

i am having route where i pass id,but i dont want to show id in url, `<Route path={`${match.url}invite-members/:groupID`} exact component={InviteMembers} />` this gets converted in url https://local..../invite-members/5 , but instead of that i want https://local..../invite-members , but the functionality should remain the same as in i get id in invite-members through this.props.match.params.groupID should be as it is,please help using react router "react-router-dom": "^4.2.2", If you want to change url to '/invite-members', you can add the Redirect component. And in case you want to save

I am using React + Redux, and after reading about react-router-redux and redux-router , and after reading Dan Abramov's answer , I decided to use "vanilla" react-router (I don't care about time travel etc. at this point). The only open question left is how to handle state across different routes. Each route sub-tree can be a different and independent section in my application (especially when it become bigger). Is it still a good practice to have one store to handle all routes/ pages? Shouldn't I (at least) have a different store/state for each main route path? I think routes should be some

I have a universal React app that is using Redux and React Router. Some of my routes include parameters that, on the client, will trigger an AJAX request to hydrate the data for display. On the server, these requests could be fulfilled synchronously, and rendered on the first request. The problem I'm running into is this: By the time any lifecycle method (e.g. componentWillMount ) is called on a routed component, it's too late to dispatch a Redux action that will be reflected in the first render. Here is a simplified view of my server-side rendering code: routes.js export default getRoutes

I'm struggling a bit with react-router 2.x configuration, specifically app basename. I've an application which may have different base root throughout its lifecycle. For instance: / in development /users in production /account in production after migration The basename comes into play in several places: static asset compilation in Webpack react-router main configuration specifying redirect routes in redux actions providing something like redirectUrl to API calls My current solution is to have an ENV variable and make it available both to Webpack and to the app itself by injecting window.defs

I want to fire an action down in my component. This is a presentation component and need not be redux aware. Router implementation is done using react-router-redux. main.js: let store = createStore(rootReducer) const history = syncHistoryWithStore(hashHistory, store) class RenderClass extends Component { render() { return ( <Provider store={store}> <Router history={history}> <Route path="/" component={MainLayout}> <Route name="employees" path="/employees" url="http://localhost:8080/" component={EmployeeTable}></Route> <Route name="personalInformation" path="/personalInformation/:employeeId"

I would like to redirect to a new page after successful login. The routes (V4) are used like this: import { browserHistory } from '....browser_history_signleton'; ... class App extends Component { render() { const { authentication: { isSignedIn } } = this.props; return ( <ConnectedRouter history={browserHistory}> <div> <Header/> <Route exact path="/" component={Home}/> <PrivateRoute isAuthorized={isSignedIn} path="/page1" component={PageOne}/> <PrivateRoute isAuthorized={isSignedIn} path="/page2" component={PageTwo}/> </div> </ConnectedRouter> ); } } The saga looks like: import {