React-router-domリンクページが正しく機能しない

Question

私はルータとの連携にreact-router-domライブラリを使用していますが、別のページにリンクしたいときは、ページを変更せずに直前に新しいページを追加しました画像のように変わります。 これを修正するにはどうすればよいですか？ mentioned image

Main.js：

const routes = (
<HashRouter> 
    <div> 
    <Route path="/" component={App} /> 
    <Route path="/about" component={About} /> 
    </div> 
</HashRouter> 
); 

ReactDom.render(routes , document.getElementById('app')); 

リンクページ：

<Menu.Item key="morepage:about"><Link to="/about">About Page</Link></Menu.Item> 

Answer 1

あなたは<Switch>の使用を確認する必要があり、それは作品ありがとう最後

import {HashRouter, Route, Switch} from 'react-router-dom'; 
<HashRouter> 
    <div> 
     <Switch> 
       <Route path="/about" component={About} /> 
       <Route path="/" component={App} /> 
     </Switch> 
    </div> 
</HashRouter>