有没有办法让路由器查询保持在 nextjs 中的页面刷新 [英] is there a way to keep router query on page refresh in nextjs

查看:24
本文介绍了有没有办法让路由器查询保持在 nextjs 中的页面刷新的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有一个带有动态 url 的动态页面.一切都是客户端渲染的.

I have a dynamic page with a dynamic url. everything is clientside rendered.

这是链接到第二页的link

<Link
href= {{ pathname: '/dashboard/[orderdetail]', query: { id: `${orderID}` } }} as={`/dashboard/${orderDetails.orderNo}`}
</Link>

这很好地将每个查询带到第二页.但是当我刷新第二页时,一切都丢失了.我通过的每个查询都丢失了

This works well taking every query to the second page. But when I refresh the second page, everything is lost. Every query i had passed is lost

我尝试过使用 with/Router

let orderID=this.props.router.query.orderdetail;

页面刷新时一切都丢失了.

Still on page refresh everything is lost.

我需要传递到第二页的 查询字符串 来调用运行良好的数据库.但同样,当我刷新页面时,没有任何效果.

I need the query string i am passing to the second page to make a call to a database which works well. But again, when I refresh the page nothing works.

页面刷新时如何避免这种丢失.

How can I avoid this loss when the page refreshes.

推荐答案

最后我得到了这个解决方案,这里没有区别

In the end I ended up with this solution, there is no difference here

               <Link
                 href={{
                  pathname: "/dashboard/" + `${orderDetails.orderNo}`,
                  query: { id: `${orderID}` },
                }} as={`/dashboard/${orderDetails.orderNo}`}
              >
              </Link>

但是在第二页中添加它以某种方式维护路由查询.

but adding this in the second page somehow maintains the route query.

export async function getServerSideProps(context) {
  return {
    props: {}, // will be passed to the page component as props
  };
}

这如何解决问题,我不知道,但确实如此.考虑到我只想要客户端渲染,我认为不会有太大的不同

How this solves the problem, I don't know, but it does. I do not think there will be that much difference considering I only wanted client-side rendering

这篇关于有没有办法让路由器查询保持在 nextjs 中的页面刷新的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆