美文网首页
nextjs 更新 route 但不刷新页面

nextjs 更新 route 但不刷新页面

作者: Lupino | 来源:发表于2021-10-21 21:35 被阅读0次

以前看到一些网页,打开新页面就好像弹出层一样。
我们在用nextjs 的时候也希望类似的功能。
我们去刷新表格数据,不刷新页面,但要改变页面的地址。
保证我们后退能回到之前的页面。
在 nextjs 中我们可以使用 shallow 模式。
在router.push的时候设置 shallow 为 true 就可以,代码如下:

   import {useRouter} from 'next/router';

   const router = useRouter();
    router.push(router.pathname, {
      query: {from, size},
    }, {shallow: true});

如果需要弹出层的效果,就做一个弹出层的页面,和对应的页面一样就可,效果挺好的。

相关文章

网友评论

      本文标题:nextjs 更新 route 但不刷新页面

      本文链接:https://www.haomeiwen.com/subject/ppeqaltx.html