ReactJS Router V4 history.push not working -

i have upgraded react router v4 , struggling history.push method.

i have index.js file:

import react "react"; import { render } "react-dom"; import { browserrouter, route } 'react-router-dom'; import createbrowserhistory 'history/createbrowserhistory';  const history = createbrowserhistory();  import { main} "./components/main"; import { } "./components/about"; import { cars} "./components/cars";   class app extends react.component {  render() {     return (         <browserrouter history={history}>              <div>                 <route path={"/"} component={main} />                 <route path={"/cars"} component={cars}/>                 <route path={"/about"} component={about}/>             </div>         </browserrouter>     )   } }  render(<app/>, window.document.getelementbyid("app")); 

and have file, added simple return page looks this:

import react "react"; import createbrowserhistory 'history/createbrowserhistory';  const history = createbrowserhistory();  export class cars extends react.component {   navigateback() {     history.push('/')   }    render() {     return(         <div>             <h3>overview of cars</h3>             <p>model: </p>             <button onclick={this.navigateback} classname="btn btn-primary">back</button>         </div>     )   } } 

so, cannot figure out whats going wrong here. when click on button, url changes / thats all. there can me out?

edit

i found out, works when this:

this.props.history.push('/home') 

and

<button onclick={this.onnavigatehome.bind(this)} 

but seems wrong somehow??

when

this.context.history.push('/home') 

i cannot read property 'context' of null why?? <browserrouter> setup wrong??

anyway, :)

with v4 have use this.context.history.push('/cart');
check out these posts more insights:

how push history in react router v4?

history.push not working when using browserrouter