What is the difference between "push" method from react-router-redux and "browserHistory" from react-router?

Question

I am trying to update history in react when the user navigates from one page/route to another. But confused about what method I should use to achieve this and why?

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

OR

import { routerMiddleware, push } from 'react-router-redux'
const middleware = routerMiddleware(browserHistory)
const store = createStore(
  reducers,
  applyMiddleware(middleware)
)

store.dispatch(push('/bag'))

Please help. Thanks in advance :)

Answer 1

Essentially, if you understood the reason for you to use redux and react-router-redux :

store.dispatch(push('/bug')) is keeping the navigation state in the store, pushes and navigates to the route

whilst

browserHistory.push('/bag') just pushes and navigates to the route.

From the source code itself

/**
* These actions correspond to the history API.
* The associated routerMiddleware will capture these events before they get to
* your reducer and reissue them as the matching function on your history. */

export const push = updateLocation('push')

Id suggest looking into the source code when trying to understand differences or how things work. Its good for learning and also for deeply understanding whats going on with the libraries you're using :)