以前是这样做的：
import { useRouter } from 'next/router'; export default function TacoPage() { const router = useRouter(); const { taco } = router.query; ``` but this no longer works.
字符串
gfttwv5a1#
你现在使用的是Web API标准URLSearchParams的只读版本。这是由Next.js提供的，如下所示：
'use client' import { useSearchParams } from 'next/navigation' export default function TacoPage() { const searchParams = useSearchParams() const taco = searchParams.get('taco') // URL -> `/cool?taco=my-taco` // `taco` -> 'my-taco' return <>Taco: {taco}</> }
字符串以下是URLSearchParams的其他只读方法：
注意-useSearchParams是一个客户端组件钩子，在服务器组件中不受支持（因此仅在客户端页面或客户端组件中可用）.这可以防止在部分呈现期间出现陈旧值。完整的解释在这里和这里。但是在服务器页面上，您可以像这样获取参数值：
useSearchParams
export default function Page({ searchParams })
型在这些情况下，它会返回这样的内容：
URL searchParams /cool?a=1 { a: '1' } /cool?a=1&b=2 { a: '1', b: '2' } /cool?a=1&a=2 { a: ['1', '2'] }
型Docs heresearchParams是一个动态的API，其值不能提前知道。使用它将在请求时选择页面进入动态呈现。searchParams返回一个普通的JavaScript对象。所以你仍然可以像这样获取查询参数：
const { a, b } = searchParams;
型.也不必担心查询参数值不存在，因为它们不会出错，它们只会是undefined。来自Next.js文档here。这是它所依据的标准。这是MSN doc的主题。
undefined
1条答案
按热度按时间gfttwv5a1#
你现在使用的是Web API标准URLSearchParams的只读版本。这是由Next.js提供的，如下所示：
字符串
以下是URLSearchParams的其他只读方法：
注意-
useSearchParams是一个客户端组件钩子，在服务器组件中不受支持（因此仅在客户端页面或客户端组件中可用）.这可以防止在部分呈现期间出现陈旧值。完整的解释在这里和这里。但是在服务器页面上，您可以像这样获取参数值：
型
在这些情况下，它会返回这样的内容：
型
Docs here
searchParams是一个动态的API，其值不能提前知道。使用它将在请求时选择页面进入动态呈现。searchParams返回一个普通的JavaScript对象。
所以你仍然可以像这样获取查询参数：
型
.也不必担心查询参数值不存在，因为它们不会出错，它们只会是
undefined。来自Next.js文档here。
这是它所依据的标准。
这是MSN doc的主题。