Javascript NextJS\u app.tsx组件和pageProps应该是什么类型的TypeScript？

以下是NextJS的默认_app.tsx：

function MyApp({ Component, pageProps }) {
  return (
    <Component {...pageProps} />
  )
}

函数MyApp（{Component，pageProps}）{
返回(
)
}

---

问题是，只要切换到TypeScript，就会在ES6Lint下收到一条警告，即这些类型本质上被设置为“any”类型。也就是说，我不知道将这两个设置为哪种类型不会在以后导致更多不匹配类型的错误。我应该将这两种类型转换为什么类型？

您可以从

nextjs

导入类型

import { AppProps } from 'next/app';

function MyApp({ Component, pageProps }: AppProps) {
  return <Component {...pageProps} />
}

从'next/app'导入{AppProps}；
函数MyApp（{Component，pageProps}:AppProps）{
返回
}

如果仍然收到“函数缺少返回类型”的警告，只需添加返回类型JSX.Element即可

import { AppProps } from 'next/app'

export default function MyApp({ Component, pageProps }: AppProps): JSX.Element {
  return <Component {...pageProps} />
}

从“下一个/app”导入{AppProps}
导出默认函数MyApp（{Component，pageProps}:AppProps）：JSX.Element{
返回
}

如果您也需要

err

对象：

导出默认功能应用程序({
组成部分，
页面道具，
犯错误
}：AppProps&{err:any}）{
//解决方法https://github.com/vercel/next.js/issues/8592
返回
}

NextJS提供了一种

AppProps

类型，您可以在

\u app

组件中导入和使用该类型。但是，正如其他人所提到的，此类型将子

pageProps

类型限制为“any”

我不是专家，所以如果我错了，请编辑这个，但是通过对NextJS文件的快速挖掘，似乎提供的

AppProps

类型是泛型的，但它接受的类型参数只能传递给

。这不是我们想要的“初始”应用程序道具所能看到的。我有一个有效的方法来覆盖它，并告诉它使用任何你想要的页面道具

请参见下面的示例，了解我用来为

App

组件提供

App

实际识别的自定义初始pageProps类型的内容。请注意，新的泛型类型将自定义pageProps类型传递给顶级

pageProps

变量以及NextJS'

AppProps

泛型类型上的内置类型参数。。。多丰盛啊

\u app.tsx

//导入提供的NextJS类型
从“next/app”导入类型{AppProps as nextapprops}；
//修改版本-允许自定义pageProps类型，返回“任意”
键入AppProps={
pageProps:P；
}&省略；
//像这样使用新类型，将“CustomPageProps”替换为您想要的任何内容
导出默认功能应用程序({
组成部分，
页面道具，
}：AppProps）{
//...
}

这是推荐的方法，但是这使得

pageProps

成为一种any类型，这不是很有用。在使用日期获取方法（如

getInitialProps

）时，是否有任何方法可以应用泛型？