Question

所以我在React Router 4中努力让这个简单的情况适合我。基本上，我有一个param用于检索将呈现组件/:user的用户数据。我在该页面上还有一些更具体的视图，像/:user/:specificView那样渲染。为了防止后者错过匹配用户，比如特定视图，我一直在尝试以下正则表达式，但似乎没有什么工作正常。

<div>
    <Switch>
      <Route
        exact
        path="*/:user/:specificView(coolview|niceview|okview)"
        render={routerProps =>
          <SpecificViewContainer {...routerProps} {...this.props}/>}/>
      <Route
        path="/:user"
        render={routerProps =>
          <UserPageContainer {...routerProps} {...this.props}/>}/>
    </Switch>
</div>

相对路径部分来自这两条路线可以位于任何地方（/coolusers/:user/:specificView，/okusers/butnotbad/:users/:specificView ...等）的顶部，因此它们需要是路径名的最后部分。

我已经google了很多，似乎是相对路径格式:user/:specificView，其中省略了开头斜杠，但它没有工作，所以我不相信它成功：https://github.com/ReactTraining/react-router/issues/5127

任何帮助都会很棒！不幸的是，我坚持使用相对路径的东西，因为我永远不知道服务器端视图路由是什么。

Answer 1

我一直在使用match.path来允许从各种父路线使用路线：

   <Route 
    exact 
    strict 
    path={`${match.path}/create`} 
    component={CreateComponent} />

反应路由器4的相对路径

1 个答案: