Question

我具有如下所示的主要App级别组件

        <div className="app-container">
            <AppHeader />
            <div className="app-content">
                <Routes />
            </div>
            <Notification />
        </div>

我希望<AppHeader />对于某些路线显示（或隐藏）。如何在React中以一种干净的方式完成此工作？我正在使用React Router

Answer 1

一种解决方法是创建一个新的Switch而不为那些您不想在其中显示标头的路径呈现任何内容，并为其他所有路径呈现标头。

示例

<Switch>
  <Route path="/login" />
  <Route path="/about" />
  <Route path="/*" component={AppHeader} />
</Switch>

显示/隐藏某些响应中的路线的导航组件

1 个答案: