如何从 url 获取键值 [重复]答案

【问题标题】：How to get key value from url [duplicate]如何从 url 获取键值 [重复]
【发布时间】：2021-11-21 09:45:34
【问题描述】：

我正在使用Axios 从 API 获取数据。从一个页面，我通过 URL 将数据发送到另一个页面，我想在另一个页面上使用它。

http://localhost:3000/otp?email=test.k@gmail.com

我想获得电子邮件的价值。在响应项目中，我使用 react-router-dom、Axios、钩子。

【问题讨论】：

标签： javascript reactjs react-redux react-hooks react-router

【解决方案1】：

使用钩子的一种解决方案：

import { useLocation } from 'react-router-dom'

const location = useLocation()
const email = new URL(location.href).searchParams.get('email')

【讨论】：

【解决方案2】：

你可以使用 VanillaJS

const params = new URLSearchParams(window.location.search)
const email = params.urlParams.get('email');
console.log(email)

【讨论】：

【解决方案3】：

const urlSearchParams = new URLSearchParams(window.location.search);
const params = Object.fromEntries(urlSearchParams.entries());

你应该像下面这样使用

【讨论】：

虽然此代码可能会回答问题，但提供有关它如何和/或为什么解决问题的额外上下文将提高答案的长期价值。您可以在帮助中心找到更多关于如何写好答案的信息：stackoverflow.com/help/how-to-answer。祝你好运?

【解决方案4】：

你可以使用react-router-dom中的useLocation钩子，例如：

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

const Component = () => {
  const query = new URLSearchParams(useLocation().search);

  return <div>{query.get('email')}</div>
}

了解路由中参数和查询之间的区别也很重要。

【讨论】：