两种创建组件的方式比较

2021-01-31  本文已影响0人  转移到CSDN名字丹丹的小跟班
一. 函数式
  1. 操作简单。
  2. 实现的功能也很简单,只是简单的调取和返回jsx而已(是一个静态组件)。
  3. 组件不会被实例化,整体渲染性能得到提升因为组件被精简成一个render方法的函数来实现的,由于是无状态组件,所以无状态组件就不会在有组件实例化的过程,无实例化过程也就不需要分配多余的内存,从而性能得到一定的提升。
  4. 组件不能访问this对象无状态组件由于没有实例化过程,所以无法访问组件this中的对象,例如:this.ref、this.state等均不能访问。若想访问就不能使用这种形式来创建组件
  5. 组件无法访问生命周期的方法
    因为无状态组件是不需要组件生命周期管理和状态管理,所以底层实现这种形式的组件时是不会实现组件的生命周期方法。所以无状态组件是不能参与组件的各个生命周期管理的。
  6. 无状态组件只能访问输入的props,同样的props会得到同样的渲染结果,不会有副作用
    无状态组件被鼓励在大型项目中尽可能以简单的写法来分割原本庞大的组件,未来React也会这种面向无状态组件在譬如无意义的检查和内存分配领域进行一系列优化,所以只要有可能,尽量使用无状态组件。

二. 创建类式

1.操作相对复杂,但是也可以实现更多复杂的操作
2.能够实现生命周期函数操作业务

函数式可以理解为静态组件(组件内容调取是就已经固定了,很难在修改),而类这种基于组件内部的状态来动态更新渲染内容。一个是有状态的,一个是没有状态的。

参考

上一篇下一篇

猜你喜欢

热点阅读