使用HashRouter时进行编程导航

我在react.js应用程序中使用HashRouter进行路由。然后我有一个函数,它执行以下操作:

this.props.history.push('/somePath');

问题是,自从我开始使用 HashRouter ,当调用该函数时,页不会推送到该路径。

this.props.history ,和 push

哈希路由器 ?

注意:我用过 withRouter

import React, { Component } from 'react';
import { HashRouter, Route, Switch, Redirect, withRouter } from 'react-router-dom';
// Other imports

class App extends Component {
    navigate = () => {
        this.props.history.push('/route1');
        console.log(this.props.history);
    };

    render() {    
        return (
            <div className="App">
                <Header />

                <HashRouter>
                    <Switch>
                        <Route
                            path="/route1"
                            exact
                            render={() => (
                                <FirstRoute someSetting='setting1'/>
                            )}
                        />
                        <Route
                            path="/route2"
                            exact
                            render={() => (
                                <SecondRoute anotherSetting='Really Cool'/>
                            )}
                        />
                        <Route path="/404" component={NotFound} />
                        <Route exact path="/" render={() => <HomePage someSettings='Home Page' />} />
                        <Redirect to="/404" />
                    </Switch>
                </HashRouter>

                <BottomBar />
            </div>
        );
    }
}

export default withRouter(App);