Question

我试图实现react-router而且缺少某些东西。我无法浏览

domain.com/projects/-KBnGTGY0WZQSZIa7nRc

我期望成为具有projectId的项目的子域

这是我的路线设置

<Router history={new HashHistory}>
    <Route path="/" component={Main}>
        <Route path="profile" component={Profile}   onEnter={requireAuth}  />
        <Route path="projects" component={Projects} >
           <Route path="/projects/:projectId" component={ProjectsDetails} />
        </Route >
        <Route path="login" component={Login} />
        <Route path="logout" component={Logout} />
        <Route path="register" component={Register} />
        <Route path="*" component={Register}/>
    </Route>
</Router>

我也像这样链接到子路径

<Link to={`/projects/${this.props.item.key}`}>
    <h3 className="project-list-h3">{this.state.text} </h3>
</Link>

它只是恢复到*即注册页面。

我需要在{ProjectsDetails}页面添加一些内容吗？它甚至称之为，所以我相信问题在其他地方。

由于

Answer 1

在上面提供的示例中，您的路线将是/ projects / projects /：id。如果您希望路径如path =“/ projects /：projectId”，则不会将其嵌套在项目路径中。我已经包含了一个官方文档的链接，该文档概述了这个概念。 Official docs routes

如果您查看示例，它会向您显示类似的嵌套路由，请注意您将父路径和子路径组合在一起以获取子路径的路径。

<Router>
  <Route path="/" component={App}>
  <Route path="about" component={About} />
  <Route path="inbox" component={Inbox}>
    <Route path="messages/:id" component={Message} />
  </Route>
</Route>

/ inbox / messages /：id App - ＆gt;收件箱 - ＆gt;消息

react-router - 未显示的子路由

1 个答案: