Question

我刚刚在我的应用程序中实现了react-router。我有一系列＆＃34;页面＆＃34; （组件）我在不同的网址上呈现：

ReactDOM.render(
  <BrowserRouter>    
    <div>
      <Route path='/Home' component={Home} />
      <Route path='/Shop' component={Shop} />
      <Route path='/Contact' component={Contact} />
    </div>
  </BrowserRouter>,
  document.getElementById('root')
)

我的问题是，我无法找到使主页成为用户看到的第一页的正确方法。现在我必须手动将/Home添加到我的网址才能查看，这显然不是首选。

我尝试添加/的重定向，将您带到主页 -

<Redirect from="/" to="/Home" />

但问题是，由于/位于每个网址中，因此我输入的任何网址都会重定向到家中。

有没有办法让它更明确，以便在/是附加到网址的唯一内容时重定向？或者有更好的方法来完成我的整体问题吗？任何帮助将不胜感激！

Answer 1

更改

<Route path='/Home' component={Home} />

到

<Route path='/' exact component={Home} />

现在主页只会在您完全/时显示。

修改：请参阅此处的文档：https://reacttraining.com/react-router/web/api/Route/exact-bool

如何制作特定组件的初始路线？

1 个答案: