react-redux-starter-kit

react-redux-starter-kit copied to clipboard

I want to redirect after receive response from server in action. What is the best way to do it?

export const redirect = (event) : Function => {
  return (dispatch: Function) => {
    event.preventDefault()
     return axios.post('http://localhost:8080/api/some',data)
            .then((res) => {
                //redirect here
               })
               .catch((err) => {
                    dispatch(handleErrors(err.response.data.error))
               })
   }
}

You can import push or replace function from react-router-redux. They accept url or desctiption object as param, described here

 import { push, replace } from 'react-router-redux'

// and then anywhere in the code
dispatch(push('/url'))
dispatch(replace('/url'))

Thank you I've tried, url is changing but page stills the same, I have tried redux-router but same issue.

I'm using browserHistory.push from react-router.

import { browserHistory } from 'react-router'
...
browserHistory.push('/url')

Only context router is working for me. It is a good practice? Like,

class Header extends React.Component{
 logout(e){
   e.preventDefault()
   this.props.logout()
   this.context.router.push('/auth')
 }
render(){...}
}
Header.contextTypes = {
  router: React.PropTypes.object.isRequired
}
export default connect(null , {logout})(Header)

@enesTufekci In case if you use react-router-redux and routerMiddleware + createBrowserHistory then it should be possible to do that with push from the same module. Then it should be synced with the redux store accordingly. Doesn't this work for you? I'm also curious how would you test routes in this case.