React Router + Redux - send asynchronous action when changing a route?

I have a universal response application using reduction and a reactive router.

I have several ways as follows:

/2016
/2015
/2014
/2013

and etc.

Each route requires data from the API. Currently, I have elements <Link>in the Navigation component dispatching an asynchronous action onClickthat populates the store with data from the API for this route.

For MVP, I just overwrite the contents post: {}in the repository with the new message contents when changing the route, so we get the new content that was in the API.

I understand that the presence of action dispatchers on the buttons is <Link>not optimal, since clicking on the "Back" button does not cause the action to be resent to receive content for the previous route.

Is there a way to get a React Router to trigger a send action at any time when changing a route? (Limiting it to listening to a specific set of routes would be a bonus).

I understand that I should get the story from the store, but at the moment it’s easier to start the API again, causing the action to be sent to get new content .

Greetings.

+4
source share
1 answer

Reah Router OnEnter onLeave. , store, :

const createRoutes = (store) => {
  const fetchPosts = () => store.dispatch({
    types: ['FETCH_POSTS', 'FETCH_POSTS_SUCCESS', 'FETCH_POSTS_FAIL',
    url: '/posts'
  });

  return (
    <Route path="/" component={App}>
      <Route path="posts" component={PostList} onEnter={fetchPosts}/>
      <Route path="posts/:id" component={PostDetail} />
    </Route>
  )
}

- - redial redux-async-connect. , , .

+6

All Articles