如何从 url 获取 queryString？

Question

我正在尝试从 url 获取密钥，它什么也没得到，

这是浏览器 url 例如我想要这样

auth/reset-password/finish?key=123

我正在这样设置路线

 path: '/auth/reset-password/finish/:key?'

这里是主要成分

  const key = queryString.parse('key', location.search);

如果我做了控制台，它会给我 null

我确实在控制台记录了它给我的位置，就像这样

pathname: "/auth/reset-password/finish"
search: "?key=Hci5deBRQJSofcD0aVru"
 hash: ""
 state: undefined
__proto__: Object

Answer 1

如果您使用的是 react-router，您可以从位置对象获取查询：

this.props.location.query.key

要获取命名参数，您可以使用：

this.props.match.params.key

编辑：此解决方案适用于 react-router 3 及以下版本。

Answer 2

如果你的路径是路径：/auth/reset-password/finish/:key?
所以你的路线应该是 /auth/reset-password/finish/123

您可以通过this.props.match.params.key

访问密钥

这里匹配你将从 react-router

Answer 3

希望你一切顺利，请检查希望它会有效

现在这是函数 return 对象，拥有所有 url 参数

      callDecodeUrl=(url)=>{
       var decodeURL = decodeURIComponent((url + '').replace(/\+/g, '%20'));
       var query = queryString.parseUrl(decodeURL);
       return query.query
      }

 

    var url =  this.callDecodeUrl('
    console.log(url)

Answer 4

[解决方案] 所以这是我对我的问题的回答

  const key = queryString.parse(location.search);

所以如果我做了控制台日志。 console.log('keyssss', key); 它给了我键值谢谢大家的时间

如何从 url 获取 queryString？

How to get queryString from url?

query-string

reactjs

react-hooks