React-router-dom v6 参数

【问题标题】：React-router-dom v6 paramsReact-router-dom v6 参数
【发布时间】：2021-11-20 05:34:49
【问题描述】：

如何使用 react-router-dom v6 在 react 中创建路由？

目前我正在尝试：

<Route path="/registration:id" element={<Registration />} />

使用“http://localhost:3000/registration?code=testCode”的 url，我收到错误：

No routes matched location "/registration?code=testCode

我尝试过以多种不同方式操作路由路径，唯一可行的方法是路径不包含查询部分“:id”。

这是 v6 的新语法还是我做错了什么？

【问题讨论】：

【解决方案1】：

React-router-dom 通常只处理 URL 的 path 部分而不是查询字符串，并且在 RRDv6 中有一个 useSearchParams 钩子可以用来访问查询字符串参数。您不会指定任何路径匹配参数，因为这应该用于匹配 URL 的 path 部分。

给定：

例子：

const [searchParams] = useSearchParams();
const code = searchParams.get('code'); // "testCode"

【讨论】：