高阶组件是一个函数，传给它一个组件，返回一个新的组件。（其实就是相当于给原组件加了些props，注意返回的时候加上原来的props 如 < WrappedContent{…methods} {…this.props} />）
高阶组件的作用主要是为了代码的复用，写一个组件，在这个组件里面使用props得到高阶组件中的数据，然后使用高阶组件函数传入这个组件和参数达到复用的效果，还是看代码吧。
高阶组件（函数）：
import React, { Component } from 'react'
export default (WrappedComponent, name) => {
class NewComponent extends Component {
constructor () {
super()
this.state = { data: null }
}
componentWillMount () {
let data = localStorage.getItem(name)
this.setState({ data })
}
render () {
return <WrappedComponent data={this.state.data} {...this.props}/>
}
}
return NewComponent
}
组件：
class InputWithUserName extends Component {
render () {
return <input name='name' value={this.props.data} /> //可以使用props得到高阶组件中的属性，高阶组件里也可以使用this.props得到这个组件中的props
}
}
使用高阶组件
InputWithUserName = wrapWithLoadData(InputWithUserName, 'username')
export default InputWithUserName
关于高阶组件的应用主要分为两大类，代理方式和继承方式。
代理方式：
操纵prop
访问ref（不推荐）
抽取状态
包装组件
继承方式：
操纵生命周期
操纵prop
