很多时候比较坑的是，你根本不知道有这个东西
或者说你没有意识到你平常用的东西在别人眼中的价值
What ?
HOC (Higher-order component)
是一种React的进阶使用方法。
Why ?
便于组件的复用，获取一个组件，返回一个更高级的组件。
Where ?
- 代码复用，代码模块化
- 增删改props
- 渲染劫持
Code Example
// 修改 props
function control(wrappedComponent) {
return class Control extends React.Component {
render(){
let props = {
...this.props,
message: "You are under control"
};
return <wrappedComponent {...props} />
}
}
}
// 渲染劫持
function loading(wrappedComponent) {
return class Loading extends React.Component {
render(){
if(this.props.data) {
return <div>loading...</div>
}
return <wrappedComponent {...props} />
}
}
}