React.FC不再建议使用

2021-06-08  本文已影响0人  shanshanfei

React.FC不再建议使用

定义函数组件时,使用React.FC与不使用没有太多区别,没有为我们带来明显的好处,建议使用常规定义方式。

以下是常见的两种定义函数组件的ts写法:

const Title: React.FunctionComponent = () => <div>1</div>;
const Title: React.FC = () => <div>1</div>;

带来的问题可具体阅读附录【参考1】,这里仅简单总结:

  1. React.FC类型的函数组件自带children属性,但很多时候并不需要,在使用上可能造成困惑;
const SomeComponent: React.FC = () => <div>xxxxx</div>;
<SomeComponent>yyyy</SomeComponent> // 实际yyyy并没有啥意义 但不会报错
  1. 无法使用defaultProps的默认值。本身函数组件使用defaultProps的情况也比较少。实际可以使用es6语法,给参数赋予初始默认值。
  2. 加上React.FC和不加 没有区别,还会造成多写代码。
// 效果等价
const SomeComponent: React.FC = () => <div>xxxxx</div>;
const SomeComponent => <div>xxxxx</div>;

阅读:
早年PR
参考1

上一篇 下一篇

猜你喜欢

热点阅读