javascript - 使用 React Router 隐藏路由的特定组件

Question

在我的代码中，我希望在除“/login”之外的所有路由中呈现页眉和页脚组件，那么该怎么做呢？如何隐藏特定路线上的组件？

const AppRouter = () => {
  return (
    <BrowserRouter>
      <div>
        <Header />
        <Switch>
          <Route path="/login" component={Login} /> {/* I wanna render this route without Header & Footer */}
          <Route path="/" component={Home} exact />
          <Route path="/product" component={ProductOverview} />
          <Route path="/profile" component={Profile} />
          <Route component={NotFound} />
        </Switch>
        <Footer />
      </div>
    </BrowserRouter>
  );
};

标签： javascriptreactjsreact-routerreact-router-dom