NextJS Router.push 解码答案

【问题标题】：Next.js router.push encodes query parametersNextJS Router.push 解码
【发布时间】：2021-04-01 15:11:34
【问题描述】：

我正在尝试使用 router.push 进行重定向以传递一个 queryString，但是当我尝试在我的参数中传递一个带有特殊字符的值时，因为逗号正在编码我的 url，是否可以将 ',' 传递到使用 router.push 的 url？

我尝试了很多东西，但我不知道如何让它发挥作用。

router.push({
  pathname: router.pathname,
  query: { ...router.query, pets: 'cats,dogs'},
})

生成的 url 将是 myurl?pets=cats%2Cdogs 我希望它是 myurl?pets=cats,dogs

【问题讨论】：

【解决方案1】：

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

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

阅读时需要解码它们：

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

【讨论】：