ReactJS Router V4 history.push не работает

Я обновился до React Router V4 и теперь борюсь с методом history.push.

У меня есть файл index.js:

import React from "react";
import { render } from "react-dom";
import { BrowserRouter, Route } from 'react-router-dom';
import createBrowserHistory from 'history/createBrowserHistory';

const history = createBrowserHistory();

import { Main} from "./components/Main";
import { About } from "./components/About";
import { Cars} from "./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"));

А потом у меня есть еще один файл, где я добавил простой возврат на определенную страницу, которая выглядит так:

import React from "react";
import createBrowserHistory from '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>
    )
  }
}

Итак, я не могу понять, что здесь происходит не так. Когда я нажимаю на кнопку, URL-адрес меняется на /, но это все. Есть ли кто-нибудь, кто может мне помочь?

ИЗМЕНИТЬ

Я узнал, что это работает, когда я делаю это:

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

а также

<button onClick={this.onNavigateHome.bind(this)}

а вроде как-то не так??

когда я делаю

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

Я получаю Cannot read property 'context' of null, но почему?? Моя настройка <BrowserRouter> неверна??

В любом случае спасибо за помощь :)