react Hook Class 区别

342 阅读1分钟

class组件——功能全、东西多;

麻烦 

函数组件——功能弱、东西少;

方便 

 函数组件:

1.状态——能变的、重新渲染 class √ fc × hook 

2.this——当前实例 class √ fc × 

3.ref——引用 class √ fc × hook 

4.方法 class √ fc × 

hook:一套工具函数的集合——增强fc的功能 hook!=函数组件 

 ------------------------------------------------------------------------

 1.状态——useState this.state 

2.影响——useEffect 把操作推迟到渲染完成,操作的结果会在下次渲染体现 模拟一部分生存周期函数 

3.引用——useRef/forwardRef 

4.上下文——useContext theme主题 

5.数据——useReducer 

 ------------------------------------------------------------------------