React Router DOM - すべてのページにナビゲーションバーを含めるにはどうすればいいですか？

Question

私はApp.jsコンポーネントでこのコードを持っている：

render() { 
     return (
      <div> 
       <Navbar/> 
       <BrowserRouter> 
        <Switch> 
         <Route exact path="/" component={Home}/> 
         <Route path="/about" component={About} />       
         <Route path="*" render={() => <Redirect to="/" />} /> 
        </Switch> 
       </BrowserRouter> 
      </div> 
     ); 
    } 

は今、私は私の他の構成要素の一つでリンクコンポーネントを含めることを試みたが、私はBrowserRouterがのルート要素なければならないことを考え出しましたApp.jsコンポーネントが動作するようにします。ここで、ナビゲーション・バーをすべてのページに含めるには、どのようにルート・エレメントにするのかと思います。

Answer 1

コンポーネントを<Switch>コンポーネントの外に置くだけで済みます。私自身のプロジェクトを見てみると

<BrowserRouter> 
    <div> 
     <Navbar/> 
     <Switch> 
      <Route exact path="/" component={Home}/> 
      <Route path="/about" component={About} />       
      <Route path="*" render={() => <Redirect to="/" />} /> 
     </Switch> 
    </div> 
</BrowserRouter>