🚜

HOC 高阶组件

This wiki is built in Notion. Here are all the tips you need to contribute.

HOC 是什么

React 中复用组件的高级技巧,思想是AOP,是一种设计模式
https://reactjs.org/docs/higher-order-components.html
高阶组件就是参数为组件,返回值为新组件的函数
const hoc = higherOrder(wrappedComponent);
  • 高阶组件就是一个返回了组件的函数
  • 通过组件嵌套的方法给子组件添加更多的功能
  • 接收一个数组作为参数并返回一个经过改造的新组件

为什么要使用高阶组件

  1. 抽取重复代码,实现组件复用
  1. 条件渲染,控制组件的渲染逻辑(渲染劫持)
  1. 捕获/劫持被处理组件的生命周期