从react-router哈希片段获取查询参数 [英] Getting query parameters from react-router hash fragment

问题描述

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

I'm using react and react-router for my application on the client side. I can't seem to figure out how to get the following query parameters from a url like:

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

我的路线看起来像这（我知道这条路是完全错的）：

My routes look like this (the path is totally wrong I know):

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>
);

我的路线工作正常，但我不知道如何格式化路径来获取参数我想要。感谢任何帮助！

My route is working fine but I'm just not sure how to format the path to get the parameters I want. Appreciate any help on this!

推荐答案

注意：复制/粘贴评论。一定要喜欢原帖！

Note: Copy / Pasted from comment. Be sure to like the original post!

在es6中写入并使用react 0.14.6 / react-router 2.0.0-rc5。我使用此命令在我的组件中查找查询参数：

Writing in es6 and using react 0.14.6 / react-router 2.0.0-rc5. I use this command to lookup the query params in my components:

this.props.location.query

它会在网址中创建所有可用查询参数的哈希值。

It creates a hash of all available query params in the url.

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

For React-Router v4, see this answer. Basically, use this.props.location.search to get the query string, and parse with the query-string package or URLSearchParams -

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

这篇关于从react-router哈希片段获取查询参数的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！