javascript - 如何在 NEXT JS 中的路由之间传递状态?

我的页面中有一个对象内的数据。我想从那个页面重定向到另一个页面以及像下面的代码这样的数据

const redirectAppointmentStep1 = (value) => {
    router.push({
      pathname: '/Appointment/bookingstep1',
      query: {value : value},
    })
  }

我在 bookingstep1 页面中收到了这样的数据

 const {query} = useRouter()

但问题是查询出现在 url 上并且 url 看起来不干净。如何将数据从一个页面发送到另一个页面而不显示在 url 上?

我是 Next.js 的新手,所以非常感谢任何帮助。

最佳答案

如果你想发送“路由状态”,你必须通过查询字符串来完成,但你实际上可以通过 as 属性“屏蔽”在浏览器中显示的路径。

Router.push

router.push(url, as, options)

as - Optional decorator for the URL that will be shown in the browser.

您可以修饰 URL 以匹配路径名。

const redirectAppointmentStep1 = (value) => {
  router.push(
    {
      pathname: '/Appointment/bookingstep1',
      query: {value : value},
    },
    '/Appointment/bookingstep1', // "as" argument
  )
}

https://stackoverflow.com/questions/66513773/

相关文章:

firebase - 从 Firebase 文档获取时间戳/创建日期,而不是手动保存?

javascript - 创建给定字符串的指定副本的字符串

r - 按组保留所有变量的最后一个非缺失观察

unity3d - 有没有办法在着色器中合并 Unity 中的纹理?

java - 如何找到其中包含空元素的整数数组的最大元素的索引?

python - 如何链接在两个列表之间创建连接?

java - FutureTask get vs run,任务永远不会完成

amazon-web-services - AWS Elastic Beanstalk EFS 安装

kotlin - 选择随机数但排除特定值

html - 如何在 svg 圆圈中居中 svg 路径?