在React中使用HashRouter跳转页面

Question

我在我的应用程序中使用HashRouter，以防止在刷新页面时或用户尝试导航到特定路径时（例如：mysite.com/about）

我如何在标签中使用页面跳转？像这样：

<a href="#contact">Contact Me</a>

使用HashRouter导航回起始页面。有没有办法重写链接，让它跳转到特定的ID？

index.js

...
import { HashRouter } from 'react-router-dom';

ReactDOM.render(
  <HashRouter>
    <App />
</HashRouter>, document.getElementById('root'));
registerServiceWorker();

App.js

import React, { Component } from 'react';
import { Switch, Route } from 'react-router-dom';
... //import for the components
class App extends Component {
  render() {
    return (
      <div className="App">

        <TopNav />

        <div className="app-container">

        <SideNav />
          <div className="app-content">

          <Switch>
            <Route exact path='/' component={Home} />
            <Route path='/about' component={About} />
            <Route path='/projects' component={Projects} />
            ...
          </Switch>

          </div>

        </div>

        <BottomNav />

        </div>
    );
  }
}

export default App;