Reactjs Nextjs路由器查询参数未记录

我正在尝试将查询参数记录在Nextjs项目中。我从未看到记录的值，但该值显示在页面上。我应该忽略

npm dev

中的日志不显示查询参数，还是应该处理未定义的情况

/pages/test/[test].js

import {useRouter} from "next/router";
import React from "react";

const Test = () => {
    const router = useRouter();
    const {test} = router.query;
    console.log(router.query); // {}
    console.log(test);  // undefined
    return <div>
        <h1>{test}</h1>
    </div>
};
export default Test;

从“下一个/路由器”导入{useRouter}；
从“React”导入React；
常数测试=（）=>{
const router=useRouter（）；
const{test}=router.query；
console.log（router.query）；//{
console.log（test）；//未定义
返回
{test}
};
导出默认测试；

---

您需要将useEffect与两个依赖项一起使用：

import {useRouter} from "next/router";
import React, {useEffect, useState} from "react";

const Test = () => {
    const router = useRouter();
    const [query, setQuery] = useState(null);

    useEffect(()=>{
      setQuery(router.query)
      if (query){
        console.log(query); 
        console.log(query.test);
      } 
    },[router,query])
    
    return <div>
        <h1>{query && query.test}</h1>
    </div>
};
export default Test;

从“下一个/路由器”导入{useRouter}；
从“React”导入React，{useffect，useState}；
常数测试=（）=>{
const router=useRouter（）；
const[query，setQuery]=useState（null）；
useffect（（）=>{
setQuery（router.query）
如果（查询）{
console.log（查询）；
console.log（query.test）；
} 
}，[路由器，查询]）
返回
{query&&query.test}
};
导出默认测试；

或具有一个依赖项：

import {useRouter} from "next/router";
import React, {useEffect} from "react";

const Test = () => {
    const router = useRouter();

    useEffect(()=>{
      if (router.query){
        console.log(router.query); 
        console.log(router.query.test);
      } 
    },[router])
    
    return <div>
        <h1>{router && router.query && router.query.test}</h1>
    </div>
};
export default Test;

从“下一个/路由器”导入{useRouter}；
从“React”导入React，{useffect}；
常数测试=（）=>{
const router=useRouter（）；
useffect（（）=>{
if（router.query）{
console.log（router.query）；
console.log（router.query.test）；
} 
}，[路由器]）
返回
{router&&router.query&&router.query.test}
};
导出默认测试；

当您使用useEffect时，您可以确定路由器已经过调整