小编典典

从react-router哈希片段获取查询参数

reactjs

我在客户端上为我的应用程序使用react和react-router。我似乎无法弄清楚如何从如下网址获取以下查询参数：

http://xmen.database/search#/?status=APPROVED&page=1&limit=20

我的路线如下所示（我知道该路线完全错误）：

var routes = (
<Route>
    <DefaultRoute handler={SearchDisplay}/>
    <Route name="search" path="?status=:status&page=:page&limit=:limit" handler={SearchDisplay}/>
    <Route name="xmen" path="candidate/:accountId" handler={XmenDisplay}/>
</Route>
);

我的路线工作正常，但我不确定如何格式化路径以获取所需的参数。感谢任何帮助！

阅读 416

2020-07-22

共1个答案

小编典典

注意：复制/粘贴评论。确保喜欢原始帖子！

编写es6并使用react 0.14.6 / react-router 2.0.0-rc5。我使用以下命令在组件中查询查询参数：

this.props.location.query

它在URL中创建所有可用查询参数的哈希。

更新：

对于React-Routerv4，请参见此答案。基本上，用于this.props.location.search获取查询字符串并使用query-string包或URLSearchParams进行解析：

const params = new URLSearchParams(paramsString); 
const tags = params.get('tags');

2020-07-22