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

function About() {

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

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

当这个路由器参数改变时，它将调用“UseEffect”，它可以用来检索值。

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;

• 你可以在docs中找到更多的信息。

我用这个方法解决了这个问题。
首先将getServerSideProps添加到页面

//MyPage.js
export async function getServerSideProps({req, query}) {

       return {
            props: {
                initQuery: query
            }
        }
}

然后像这样创建useQuery函数

//useQuery.js
export let firstQuery = {}
export default function useQuery({slugKey = 'slug', initial = {}} = {}) {
    const {query = (initial || firstQuery)} = useRouter()

    useEffect(() => {
        if (_.isEmpty(initial) || !_.isObject(initial))
            return
        firstQuery = initial
    }, [initial])

    
return useMemo(() => {

    if (!_.isEmpty(query)) {
        return query
    }
    try {
        const qs = window.location.search.split('+').join(' ');

        const href = window.location.href
        const slug = href.substring(href.lastIndexOf('/') + 1).replace(/\?.*/gi, '')

        let params = {},
            tokens,
            re = /[?&]?([^=]+)=([^&]*)/g;
        if (slug)
            params[slugKey] = slug

        while (tokens = re.exec(qs)) {
            params[decodeURIComponent(tokens[1])] = decodeURIComponent(tokens[2]);
        }

        return params
    } catch {
    }
}, [query])
}

并且始终使用useQuery作为接收查询参数

//MyPage.js
export default function MyPage({initQuery}) {
     const query = useQuery({initial: initQuery})

    return(
      <div>
           {query.myParam}
      </div>
    )
}

在这样的组件中

//MyComponent.js
export default function MyComponent() {
     const query = useQuery()

    return(
      <div>
           {query.myParam}
      </div>
    )
}

同样的事情也发生在我的Next.js Routing上。NextJS默认设置为服务器端渲染，因为当我们重新加载页面时，我们不会立即得到查询字符串，因为它是服务器端。尝试使用UseEffect并尝试更新查询，在此之前保持页面忙碌并使用If条件阻止页面，当页面最终呈现时，然后从condition传递它。

对于那些仍然有这个问题。这里有一个解决办法，为我工作

function About() {

 const [param1, setParam1]=useState("");
 const router = useRouter();
 const { param1 } = router.query() 

 useEffect(() => {
  if (!param1) {
   return;
 }

 // use param1
 }, [param1]);
}

您可以找到solution here