如何修正Next.js Layout组件Props类型定义错误的问题？
- 内容介绍
- 文章标签
- 相关推荐
本文共计786个文字，预计阅读时间需要4分钟。
next.%3Ca+style%3D%22color%3A
在 Next.js 的 App Router 中，layout.tsx 文件的 default export 函数（即布局组件）必须且只能接收 children: React.ReactNode 这一参数。它不支持直接解构 params 或 searchParams ——这些对象仅可用于 generateMetadata、generateStaticParams 或页面组件（page.tsx）中。
你遇到的报错：
Layout "app/[prefName]/create/layout.tsx" has an invalid "default" export: Type "Props" is not valid.
本质是 Next.js 类型系统在构建时执行了严格校验（见其内部 checkFields<Diff<LayoutProps, FirstArg<TEntry['default']>, 'default'>>()），要求 layout 默认导出函数的参数类型必须与预设的 LayoutProps 完全兼容。而 LayoutProps 的定义不含 params 和 searchParams 字段，仅隐式包含 children。
本文共计786个文字，预计阅读时间需要4分钟。
next.%3Ca+style%3D%22color%3A
在 Next.js 的 App Router 中，layout.tsx 文件的 default export 函数（即布局组件）必须且只能接收 children: React.ReactNode 这一参数。它不支持直接解构 params 或 searchParams ——这些对象仅可用于 generateMetadata、generateStaticParams 或页面组件（page.tsx）中。
你遇到的报错：
Layout "app/[prefName]/create/layout.tsx" has an invalid "default" export: Type "Props" is not valid.
本质是 Next.js 类型系统在构建时执行了严格校验（见其内部 checkFields<Diff<LayoutProps, FirstArg<TEntry['default']>, 'default'>>()），要求 layout 默认导出函数的参数类型必须与预设的 LayoutProps 完全兼容。而 LayoutProps 的定义不含 params 和 searchParams 字段，仅隐式包含 children。