时间戳

首页 > 解决方案 > useRouter/withRouter 在第一次渲染时收到未定义的查询

next.js - useRouter/withRouter 在第一次渲染时收到未定义的查询

问题描述

我的动态路线有问题。它看起来像这样

[lang]/abc

我正在尝试从中获取查询值，[lang]但是当我使用时，我useRouter/withRouter在页面的 2-3 渲染期间得到了查询（首先我得到了query.lang = undefined）。有可能获得 1 个渲染或使用任何技术吗？

在此处输入图像描述

标签： next.js

解决方案

我发现了一些东西：

isReady: boolean - 路由器字段是否在客户端更新并准备好使用。应该只在 useEffect 方法内部使用，而不是在服务器上进行有条件的渲染。 https://nextjs.org/docs/api-reference/next/router#router-object

代码如下：

const router = useRouter();
useEffect(()=>{
    if(!router.isReady) return;

    // codes using router.query

}, [router.isReady]);

推荐阅读