输入 React 组件的返回类型

Question

Create-React-App 的此 PRReact.FC作为组件的返回类型删除（有关原因的原因，请参阅 PR）。这是否意味着 ESlint 的显式函数返回类型规则不再适用于 React 组件？如果是这样，如何才能让 ESlint 满意呢？

Answer 1

您可以用作React.ReactElement | null函数组件的返回类型。这就是React.FC今天所做的。

interface Props {
  children: React.ReactNode;
}

const MyComponent = ({ children }: Props): React.ReactElement => (
  <div>{children}</div>
)

Answer 2

一种选择是将函数声明为 aComponentType相反，它封装了返回类型：

import { ComponentType } from 'react';

const App: ComponentType<AppProps> = () => (
  <div>Whatever</div>
);