这个反应路线有什么问题

Question

我有这个路由配置 react-router:

render((
    <Router history={browserHistory}>
        <Route path="/" component={PoApp}>
            <IndexRoute component={Home} />
            <Route name="category" path="notices/:category" component={Category}>
                <Route name="notice" path=":id" component={Content} />
                <IndexRoute component={Home} />
            </Route>
        </Route>
    </Router>
), document.getElementById('poApp'));

对于 / 和 notices/:category 工作正常

但是对于 :id（应该是 /notices/:category/:id）它仍然加载 Category 组件。怎么了？

我在这里举了一些应该如何工作的例子，如果我不清楚的话：

/ => PoApp

/notices/cars => 类别

/notices/cars/2 => 内容

Answer 1

根据类似question的回答，嵌套路由用于嵌入嵌套组件，而不是在嵌套路由中引用不同的组件。

在您的情况下，Category 组件应该有一个子组件的占位符（例如 <RouteHandler /> 或 {this.props.children}，具体取决于您的路由器版本）。然后使用嵌套路由将适当的子组件嵌入到父组件中。

这个反应路线有什么问题

What is wrong with this react routes

javascript

reactjs

react-router