在nextJS示例中,特别是显示如何将TypeScript与NextJS一起使用的示例中,它们不使用NextPage类型。
我说的文件在这里:https://github.com/vercel/next-learn-starter/blob/master/typescript-final/pages/posts/%5Bid%5D.tsx,相关代码如下:
export default function Post({
postData
}: {
postData: {
title: string
date: string
contentHtml: string
}
}) {
return (...
我觉得可以这样写:
export default function Post : NextPage<Props> ({
postData
}: {
postData: {
title: string
date: string
contentHtml: string
}
}) {
return (...
或者类似的东西。
我的问题是,我在NextJS站点中找不到任何关于使用导入接口NextPage的文档,特别是,下一个团队将其排除在文档之外。
我应该使用NextPage吗?
3条答案
按热度按时间lf3rwulv1#
两个都可以。只是一种类型。
如果添加了
NextPage<Props>
,那么parameter中的类型声明就没有必要了,可以简化为2ledvvac2#
我应该使用NextPage吗?
NextPage是返回值的类型,Props是函数参数的类型。
Post : NextPage<Props>
我将包括这两个,因为虽然这些可以由TS解释,但最好显式地说明它们-一些linter有强制它们包含的规则。
f4t66c6m3#
NextPage
是由Next.js框架导出的类型,Next.js框架是用于构建Web应用程序的基于React的服务器端呈现(SSR)框架。它是React组件的类型别名,该组件包含用于获取服务器端呈现所需数据的getInitialProps函数。在Next.js中定义页面组件时,建议使用下一个包中的
NextPage
类型,而不是定义自己的接口或类型。这有助于确保与Next.js的兼容性,并在代码编辑器中提供有用的类型检查和自动完成支持。请参见下面的示例,
HomePage
是一个NextPage
组件,它接受Props对象,并包含一个getInitialProps函数,该函数获取一些数据并将其作为props返回。