什么是HOC？
HOC(Higher-order component)是一种React 的进阶使用方法，只要还是为了便于组件的复用。强调一点，HOC本身并不是 React API, 它就是一个方法，一个接收一个组件作为参数，返回一个增强的组件的方法。
什么时候使用HOC？
高阶组件的目的是解决一些交叉问题(Cross-Cutting Concerns)。而最早时候 React 官方给出的解决方案是使用 mixin 。但官方也意识到了使用mixins技术来解决此类问题所带来的困扰远高于其本身的价值。更多资料可以查阅官方说明。
在React开发过程中，在很多情况下，组件需要被“增强”（enhanced），比如给组件添加或修改一些特定的属性，针对多个组件的代码复用。
概括的讲，HOC能够实现：
1. 代码复用，代码模块化
2. 渲染劫持, 操作state
3. Props 增删改
HOC的实现方式
在这节中我们将学习两种主流的在 React 中实现高阶组件的方法：属性代理（Props Proxy）和 反向继承（Inheritance Inversion）。
基于属性代理（Props Proxy）的方式
属性代理是最常见的高阶组件的使用方式。可以通过对被包裹组件的props进行修改，或者添加新的props再传递给此组件，这就是属性代理。例如：
基于反向继承（Inheritance Inversion, 缩写II)的方式
反向继承的实现为：
返回的高阶组件类（Enhanced）继承了 WrappedComponent。这被叫做反向继承是因为 WrappedComponent 被动地被 Enhancer 继承，而不是 WrappedComponent 去继承 Enhancer。
反向继承允许高阶组件通过this关键词获取 WrappedComponent，意味着它可以获取到 state，props，组件生命周期（component lifecycle）钩子，以及渲染方法（render）。
使用高阶组件遇到的问题
静态方法丢失
当使用高阶组件包裹原始组件，返回的新组件会丢失原始组件的所有静态方法。例如：
解决方案：
手动拷贝所有静态方法给新组件；（不推荐）
使用hoist-non-react-statics来帮你自动处理，它会自动拷贝所有非React的静态方法；（react-router 里withRouter就使用了这个包）
Refs属性不能传递
解决方案：
新组建传递一个ref 回调函数属性给原始组件，也就是将ref组件绑定到新组件上；如：
<Enhancer getRef={ref => this.wrappedC = ref} />
更多web开发知识，请查阅 HTML中文网 ！！
以上就是react中什么是hoc？的详细内容，更多请关注易知道|edz.cc其它相关文章！
