react redux router in not defined in action

Question

My react redux work flow like:

My action.js

export function loginSuccess(response){
    return (dispatch, getState) => {
      console.log(getState())
      dispatch({ response, type: LOGIN })
      console.log(getState())
      router.transitionTo("/profile")
  };
}

I have routes.js

const routes =  (
    <Router history={browserHistory}>
        <Route path="/" component={App}>
        <IndexRoute component={Login} />
        <Route name="profile" path="/profile" component={Profile} />
        </Route>
  </Router>
)

export default routes

and my root.js

class Root extends Component {
  render() {
    const { store } = this.props
    return (
      <Provider store={store}>
          <ReduxRouter />
      </Provider>
    )
  }
}

Root.propTypes = {
  store: PropTypes.object.isRequired
}

export default Root

When doing this it gives me error router is not defined ?

What's wrong in here? Why am I getting this error? I have provided this.props in my Provider .

Anyone plz guide me through this... Banging my head on this.

Answer 1

You're trying to access an object called router in your loginSuccess function which unless it's a global variable will throw a TypeError.

You need to pass it to your loginSuccess function in order for it to work.

function loginSuccess(response, router) {
    router.transitionTo('/');
}