4

我正在使用 react-router 插件来设置我的路线我想提供两条路线list/和list/:id（很常见）我所拥有的和正在工作的是：

<Routes>
    <Route handler={App}>
        <Route name="list"
            handler={ListComponent}
            collection={new Collection()}>
        </Route>
    </Route>
</Routes>

但我正在努力让我的“细节”路线发挥作用。我尝试的是：

<Routes>
    <Route handler={App}>
        <Route name="list"
            handler={ListComponent}
            collection={new Collection()}>
            <Route name="list.details"
                path="list/:id"
                handler={DetailsComponent}>
        </Route>
    </Route>
</Routes>

首先，这目前不起作用，DetailsComponent访问 list/123 时未呈现 my （例如）

其次，即使这可行：我将如何管理将我收藏中的一个模型“向下”传递给DetailsComponent?

4

1 回答 1

2

要回答您的第一个问题，您的路由器代码有两个问题。巧合的是，正斜杠是两个问题的答案：

  1. 您需要关闭所有Route组件。如果您自己编写 a <Route>，则必须包含这样的结束标记：<Route/>。

  2. 您可能需要在列表路径的开头使用正斜杠。

所以你的代码应该是这样的：

<Routes>
    <Route handler={App}>
        <Route name="list"
            handler={ListComponent}
            collection={new Collection()}>
            <Route name="listDetails"
                path="/list/:id"
                handler={DetailsComponent}/>
        </Route>
    </Route>
</Routes>

另外，为了清楚起见，路由名称只是一个字符串标识符。我不确定你是否写list.details了一个对象访问器来访问你的模型，但如果是这样，它不会像你想象的那样做。我更改了名称以listDetails避免任何混淆，但list.details它也是一个有效的字符串标识符，因此如果您愿意，请随时将其更改回来。

这解决了您在此处提供的块中的代码问题。在没有看到DetailsComponent组件和/或任何错误消息的情况下，我无法确定是否还有其他问题。

关于您的第二个查询，解决方案相当简单（尽管react-router没有您可能希望在这里的 Backbone 集成）。但是，根据 StackOverflow 规则，恐怕我一次只能回答一个问题。因此，如果您创建一个单独的问题，我很乐意提供答案。

于 2014-10-22T16:56:24.383 回答