NextJs：功能组件条件返回/渲染

Question

您好，如果下一个路由器查询参数为空，我想重定向页面。 喜欢localhost:3000/page?id=*null/empty*

这是我在做什么：

export default function page() {
  const router = useRouter();
  const { id } = router.query;
  useEffect(() => {
    if (id == null) {
      router.push("/");
    }
  });
return (......

但问题是它首先呈现页面然后推送到另一个页面。 对这个问题有什么想法吗？

Answer 1

移除useEffect的使用

export default function page() {
  const router = useRouter();
  const { id } = router.query;
 
  if (id == null) {
    router.push("/");
    return null;
  }
 
return (......