React.FunctionComponent 和普通的 JS 函数组件有什么区别？

Question

这两个例子完成了同样的事情。但是在引擎盖下有什么区别？我了解功能组件与 React.Component 和 React.PureComponent，但我无法找到有关 React.FunctionComponent 的相关文档。

React.FunctionComponent 组件

const MyComponentA: React.FunctionComponent = (props) => {
  return (
    <p>I am a React.FunctionComponent</p>
  );
};

普通 JS 函数组件：

 const MyComponentB = (props) => {
  return (
    <p>I am a plain JS function component</p>
  );
};

原文由 jacobsowles 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

引擎盖下没有区别。第一个是使用 TypeScript 语法来指示 React.FunctionComponent 的类型，但它们都是普通的 JS 函数组件。

原文由 Ryan Cogswell 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

有一些细微差别，普通函数组件可以返回字符串，例如：

 const FooString = () => "foo";

但您无法从 FunctionComponent 返回字符串。

 const BarString: React.FC<{}> = () => "string";

因此返回类型必须是 ReactElement|null

原文由 xiechao06 发布，翻译遵循 CC BY-SA 4.0 许可协议