Next.js 刷新页面时，nextJS SSR useRouter（）不起作用

我正在我的项目中使用nextJS SSR。现在，当我尝试使用下面的代码来获取页面参数时，它显示undefined

 function About() {
  const router = useRouter();
  const { plan_id } = router.query;
  console.log(plan_id)
 }
 export default About;

---

当页面从其他页面路由时（没有使用“下一步/链接”重新加载页面），它可以工作，但当我刷新页面时，它不工作。有人能帮忙吗？

我自己找到了答案。实际上，当您刷新页面时，路由器不会立即初始化。因此，您可以在useffect钩子下添加它，如下所示，您将能够获得参数

function About() {

 const [param1, setParam1]=useState("");
 const router = useRouter();

 useEffect(() => {
  if (router && router.query) {
   console.log(router.query);
   setParam1(router.query.param1);
  }
 }, [router]);
}

当此路由器参数改变时，它将调用“UseEffect”，可用于检索值。

• 如果要访问参数，请使用Next.js样式。如果数据可以由服务器本身提供，则无需在客户端运行代码。这就是SSR背后的想法

• 您可以在中找到更多的英特尔

---

谢谢，阿曼，你说得对。即使在刷新时，我也可以通过这种方式获取参数。再次感谢。鉴于Next.js也是一个静态站点生成器，可以生成纯客户端运行的站点，所以说“do it server side”并不是最有用的答案。原因是Next如何处理自动静态优化页面。请参见此处的useSWR和良好示例：

 function About({plan_id}) {
  console.log(plan_id)
 }

 // this function only runs on the server by Next.js
 export const getServerSideProps = async ({params}) => {
    const plan_id = params.plan_id;
    return {
       props: { plan_id }
    }
 }

 export default About;