Navigation - alternative to browserHistory in react-router v4

Question

Previously, I was able to reroute user (e.g. on successful login) using browser history:

import { browserHistory } from 'react-router'

browserHistory.replace('/home')

In the new react-router I am no longer able to import browserHistory, what is the alternative way to achieve my goal?

Answer 1

import { Router, Route } from 'react-router'
import { createBrowserHistory } from 'history'

export default () => (
  <Router history={createBrowserHistory()} >
     <Route exact path="/" component={MainPageComponent} />
  </Router>
)

In MainPageComponent you can use this.props.history.push('/home').

Learn about router history here https://github.com/ReactTraining/history