[react] react声明组件有哪几种方法,各有什么不同?
- 用类声明
- 继承自
React.Component
,实例中挂载了父类的方法和属性如this.setState
,this.props
- 可以维护自己的state
- 有生命周期函数
- 父组件可以通过ref获取用类声明的子组件的实例
- 必须有render方法,并且需要返回一个
ReactNode
- 函数式声明
- 默认没有自己的状态,props需要使用函数的参数传入
- 可以使用hooks
- 使用
useState
维护自己的状态- 没有生命周期,使用
useEffect
模拟组件的声明周期- 父组件引用了函数式的子组件,父组件无法获取子组件的实例,如果需要获取子组件的中的DOM节点,使用使用
React.forwardRef
进行转发,如果还想获取子组件中定义的属性/方法,还需要使用useImperativeHandle
的Hook- 函数必须返回一个
ReactNode
作为这个组件的UI描述
个人简介
我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易,
但坚持一定很酷。欢迎大家一起讨论