如何使路径路径一/二/三？

Question

我想要这样的东西

        <Route
          path="/one/two/three"
          render={() => (
            <Component/>
          )}
          exact
        />

但是当我将它们全部包装到Router中时，它似乎在本地不起作用。我只看到Component的内容，而只是/one，但我想将/one/two/three作为路径（因为我是root用户，用户位于该路径上）。

Answer 1

在react-router-v4中，您只能拥有以下路线，

<Route path="/one" render={() => (<Component/>)} exact /> //Direct route without any params

或

<Route path="/one/:two" render={() => (<Component/>)} exact /> //Route with params, here `:two` is the parameter to route

如果您想使用示例中的路由，则可以使用BrowseRouter basename attribute，

<BrowserRouter basename="/one/two">
   <Route path="/three" render={() => (<Component/>)} exact />
</BrowserRouter>

您Link应该像

<Link to="/three"/> // renders <a href="/one/two/three">  

Answer 2

这对我不起作用的几个原因。 我在Webpack配置中缺少output: { publicPath: '/' },。

更奇怪的是，我使用PureComponent而不是Component，当使用相似的路径（x / y / z）或使用{{1} }。