About 正在重新加载整个页面

【问题标题】：Nav.Link to="/About" is not working in react-bootstrap? Nav.Link href="/About is working reloading the whole pageNav.Link to="/About" 在 react-bootstrap 中不起作用？ Nav.Link href="/About 正在重新加载整个页面
【发布时间】：2020-08-20 22:10:19
【问题描述】：

我想要的结果是在不重新加载整个页面的情况下进行导航。

<Nav.Link  to="/About">About</Nav.Link> is not working.
<Nav.Link  href="/About">About</Nav.Link> is working but reloading the whole page.

Nav.Link 是从 react-bootstrap 导入的。

这里有什么问题，如何在不通过 react-bootstrap 重新加载整个页面的情况下路由到另一个页面？

【问题讨论】：

标签： reactjs react-bootstrap

【解决方案1】：

您没有关闭第一个链接上的双引号。试试这个：

<Nav.Link to="/About">About</Nav.Link>

此外，您需要一个路由器才能正常工作。类似的东西：

<Router>
  <Switch>
    <Route path='/about'>
      <About />
    </Route>
    <Route path='/users'>
      <Users />
    </Route>
    <Route path='/'>
      <Home />
    </Route>
  </Switch>
</Router>

【讨论】：

我已将包含在 App.js 文件中。导航是一个不同的组件，我正在尝试构建导航栏。
没关系，只要确保用你的包裹你的导航栏。类似于 />...
及其子路由表示您的路由组件将显示的区域。必须包装你的整个应用程序
我已经在 App.js 文件中完成了。我应该在 Navigation.js 文件中再做一次吗？
问题解决了！我的导航组件在 App.js 文件中的之外！谢谢。