下一页 .js 路由器.推送对查询参数进行编码

Question

我正在尝试使用传递查询字符串进行重定向，但是当我尝试在我的参数中传递带有特殊字符的值作为逗号时，正在对我的 URL 进行编码。是否可以使用 '，' 将 '，' 传递到 URL 中？router.pushrouter.push我尝试了很多东西，但我不知道如何让它发挥作用。router.push({  pathname: router.pathname,  query: { ...router.query, pets: 'cats,dogs'},})生成的 URL 将是 ，我希望它是 。myurl?pets=cats%2Cdogsmyurl?pets=cats,dogs

Answer 1

使用路径和查询字符串的 URL 对象格式将对查询参数进行内部编码。

为避免这种情况，可以将路径和查询字符串作为字符串传递。

router.push(`${router.asPath}?pets=cats,dogs`)

Answer 2

您需要对 URI 参数进行解码和编码。路由器会自动为您编码查询参数：

encodeURIComponent('cats,dogs')
// "cats%2Cdogs"

阅读时需要对它们进行解码：

decodeURIComponent("cats%2Cdogs")
// "cats,dogs"

Answer 3

从上面的问题来看， 我推断出除了路径名（以 slug 形式出现）之外，还有一些其他查询参数。你希望添加它。pets=cats,dogs

如果有人想要获取路径名，我们可以使用，其余的旧查询参数可以使用 .window.location.pathnamewindow.location.search

总而言之，人们可以轻松使用

const subpathAndQuery = window.location.pathname + window.location.search;

router.push(`${subpathAndQuery}&pets=cats,dogs`);

注意：if 是查询参数的第一个键值对。您必须使用 而不是 .pets=cats,dogs?&