reactjs - React route：如何在除 home 之外的每个路由中显示组件？("/)

Question

我正在尝试构建一个带有首页和标题的 React 网站，该标题将出现在应用程序的每个部分，除了主页（'/）。哪种方法最简单？我的代码现在看起来像这样：

function App() {
  return (
    <Router>
      <Header /> {/* Header that will show everywhere except for '/' */}
      <Switch>
        <Route path="/" exact component={Frontpage} /> {/* Home frontpage component */}
        <Route path="/about" exact component={About} />
        <Route path="/projects" exact component={Projects} />
      </Switch>
    </Router>
  );
}

我正在考虑将标题组件从应用程序中取出并将其拖到每个子路径中，尽管这不是一种非常有效的方法。

标签： reactjsreact-routerreact-router-dom

Answer 1

将 Header 组合到需要它的页面中有什么问题？这根本不是无效的，这正是组件的用途。组件旨在组合，因此将其弹出到页面组件中。