reactjs – 如何解析react-router v4中的查询字符串

发布时间：2020-12-15 20:53:50 所属栏目：百科来源：网络整理

导读：在react-router v3中,我可以使用props.location.query.foo访问它(如果当前位置是？foo = bar) 在react-router-dom@4.0.0中,props.location只有props.location.search是一个字符串,如？foo = bar other = thing. 也许我需要手动解析和解构该字符串以找到foo或

在react-router v3中,我可以使用props.location.query.foo访问它(如果当前位置是？foo = bar)

在react-router-dom@4.0.0中,props.location只有props.location.search是一个字符串,如？foo = bar& other = thing.

也许我需要手动解析和解构该字符串以找到foo或其他的值.

console.log(this.props)的屏幕截图：

(注意如何从？artist = band这里我想从艺术家那里得到价值带的价值)

看起来你已经假设正确了.解析查询字符串的能力是从V4中取出的,因为多年来一直有人要求支持不同的实现.有了这个,团队决定最好让用户决定实现的样子.我们建议导入查询字符串lib.到目前为止,one you mentioned对我来说非常有用.

const queryString = require('query-string');

const parsed = queryString.parse(props.location.search);

如果您想要原生的东西并且它可以满足您的需求,您也可以使用新的URLSearchParams

const search = props.location.search; // could be '?foo=bar'
const params = new URLSearchParams(search);
const foo = params.get('foo'); // bar

您可以阅读有关决定here的更多信息

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!