使用动态确定的段塞对路由进行路由

时间:2017-11-09 15:01:48

标签: reactjs redux react-router

我正在使用React,Redux和React-router,并且想要使用以下用例:

  • 从显示条目列表的页面(每个条目都有唯一的ID和已知的slug)
  • 当您点击一个条目时,您将进入该条目的页面
  • 页面是动态加载的 - 带有页面ID的ajax请求会根据请求的输出填充所有内容。

如何使用每个项目的slug创建一个url?现在我只是有一个固定的

<Route path="/item" component={ItemPage} />

我想要的是

<Route path="/<slug>" component={ItemPage} />

只有当您从另一个页面导航到该页面时才知道slug。

我遇到的另一个问题 - 刷新后页面的所有内容都会消失。这是因为我通过状态将项目ID传递给ItemPage,并且在刷新后不再在状态中设置id。

也许更一般地说,实现上述行为的方法是什么?这似乎是一个常见的用例,我无法找到如何做的好参考。

1 个答案:

答案 0 :(得分:2)

你可以这样做:

NAs

从URL参数上的react-router文档中查看this example