反应路由器布局重新渲染

Question

我在我的 React 应用程序中遇到了这个问题，我的布局是一个导航栏，下面是我的内容。每当路线更改时，导航栏不应在分析器中重新呈现。我在可以使用的沙箱中找到了这个示例，我的应用程序也有类似的逻辑。

代码沙盒：Link

代码如下：

<Router>
      <Switch>
        <Route path='/login' component={Login} />


        <Route path='/admin/:path?' exact>
          <MainAdmin>
            <Switch>
              <Route path='/admin' exact component={Dashboard} />
              <Route path='/admin/setting' component={Setting} />
            </Switch>
          </MainAdmin>
        </Route>
        
        <Route>
          <Main>
            <Switch>
              <Route path='/' exact component={Home} />
              <Route path='/about' component={About} />
            </Switch>
          </Main>
        </Route>


      </Switch>
    </Router>

重现我的问题。打开 codeandbox 上的 devtools 并选择设置，然后在常规选项卡下选择在组件渲染时突出显示更新。然后点击侧边栏中的链接，你会看到它们重新渲染