获取表单提交的 url 参数 REACT { http://localhost:3000/shop/sidebar/list?cat=&q=black }答案

【问题标题】：Get url params for form submit REACT { http://localhost:3000/shop/sidebar/list?cat=&q=black }获取表单提交的 url 参数 REACT { http://localhost:3000/shop/sidebar/list?cat=&q=black }
【发布时间】：2021-02-26 13:07:51
【问题描述】：

我需要帮助才能从表单提交中获取 URL 参数

http://localhost:3000/shop/sidebar/list?cat=&q=black

我需要得到 q 的值

我知道路

using onSubmit={ onSubmitHandler}

但我需要一种不同的方式

<form action={`${process.env.PUBLIC_URL}/shop/sidebar/list`} method="GET">



<Route exact
          path={`${process.env.PUBLIC_URL}/shop/sidebar/:grid`}
          component={Sidebar}
   />

当我使用时

import {useParams} from 'react-router-dom';

然后做

const query = useParams().grid
console.log(query)

我只看到列表，但我需要一个 q 值

【问题讨论】：

标签： javascript reactjs react-router react-router-dom query-parameters

【解决方案1】：

import React from "react";
import { useLocation} from "react-router-dom";

使用路由器 dom 做到这一点

  let query= new URLSearchParams(useLocation().search);
  let value = query.get("q");

或者没有路由器 dom 这样做

  let query= new URLSearchParams(window.location.search);
  let value = query.get("q");

【讨论】：