在React中获取URL参数

2024-11-26 来源：个人技术集锦

在React中获取URL参数的方法有以下几种：

const searchParams = new URLSearchParams(window.location.search);
const id = searchParams.get('id');
使用react-router-dom

如果使用了react-router-dom路由库，则可以使用useParams钩子来获取URL参数。例如，如果的URL路径为/users/:id，可以像这样获取id参数：

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

function User() {
  const { id } = useParams();
  return <div>{id}</div>;
}

可以使用query-string库来解析URL查询参数。

import queryString from 'query-string';

const values = queryString.parse(window.location.search);
const id = values.id;

显示全文