我在 Next.js 15 应用中尝试使用异步参数时遇到问题。我想slug
从中提取参数params
,该参数作为返回Promise
。
这是我当前的设置page.tsx
:
type tParams = Promise<{ slug: string[] }>;
export default async function Challenge({ params }: { params: tParams }) {
const { slug } = await params;
const productID = slug[1];
// other code here
}
当我运行时npm run build
,出现此错误:
类型错误:类型“{params:{id:string;};}”不满足约束“PageProps”。属性“params”的类型不兼容。类型“{id:string;}”缺少类型“Promise”中的以下属性:then、catch、finally、[Symbol.toStringTag]
似乎 的类型params
导致了问题,可能是因为 Next.js 需要 的不同结构params
。
我尝试过的方法
- 我最初定义
params
为{ slug: string[] }
,但我将其更改为,Promise<{ slug: string[] }>
以尝试处理异步行为。 - 我也尝试了不同的类型配置,但是
params
都没有成功。
问题
如何params
在 Next.js 15 中正确输入异步访问的对象,或者是否有其他推荐的方法?
1
最佳答案
1
从迁移指南中的示例中,他们表明您不能使用道具的解构成员……
也许可以尝试一下这种改变 –
type tParams = Promise<{ slug: string[] }>;
export default async function Challenge(props: { params: tParams }) {
const { slug } = await props.params;
const productID = slug[1];
// other code here
}
|
–
|