行反应路由器

我正在尝试使用查询字符串设置路径路径。 一线的东西：


www.mywebsite.com/results?query1=:query1&query2=:query2&query3=:query3


然后我会移动到组件 "Results" 像这样：


<route component="{Main}" path="/">

<indexroute component="{Home}"></indexroute>

<route component="{SearchResults}" path="results?query1=:query1&amp;query2=:query2&amp;query3=:query3"></route>

</route>


在容器中 SearchResults 我希望能够访问参数 do query1, query2 和 query3.

我无法做到它。 我收到以下错误：

bundle.js:22627 警告：位置 [react-router]
"/results?query1=1&query2=2&query3=3" 不匹配任何一方

我试图执行以下手册中描述的步骤： /部分：查询字符串的参数如何？/
https://www.themarketingtechno ... tion/
/

我可以在这里得到任何帮助吗？
2021-03-21 添加评论
分享

没有找到相关结果

    已邀请:

    三叔

    赞同来自:

    如果您正在使用 React Router v2.xx, 您可以通过对象访问查询参数
    location.query

    , 转移到您的路线组件。

    换句话说，你可以重塑你的路线，以便它看起来像：


    <route component="{SearchResults}" path="results"></route>


    然后在您的组件内部
    SearchResults

    使用
    this.props.location.query.query1

    /如同
    query2

    和
    query3

    / 访问查询参数的值。

    EDIT:

    它仍然属于 React Router v3.xx.
    2021-03-21 0 0
    分享

    董宝中

    赞同来自:

    如果您正在使用 React Router >= v4
    location.query

    不再可用。 您可以连接外部库 /例如
    https://www.npmjs.com/package/query-string
    / 或使用这样的东西：


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


    /请记住
    https://developer.mozilla.org/ ... arams
    互联网不支持 Explorer/
    2021-03-21 0 0
    分享
    为什么被折叠? 0 个回复被折叠

    要回复问题请先登录或注册

    Copyright © 2023, All Rights Reserved