• HOC和Render Props的区别
  1. HOC模式简单，就是一个封装和一个返回就完事了，但是会增加组件的层级，有可能会导致透传props时候可能会出现重名覆盖，不太好维护
  2. Render Props代码简洁
• Render Props核心思想就是通过一个函数将class组件的state作为props传递给纯函数组件，实际上就是通过render属性把一个纯函数组件传递给类组件（抽离出去的具有某种功能的组件），当这个类组件调用传过来的render的时候，再把自己的state传递给这个纯函数组件，然后渲染
• 纯函数组件：一个函数的返回的jsx只依赖于它的参数props，并且函数执行过程中没有副作用
• 官网例子 ```jsx import React from ‘react’ import PropTypes from ‘prop-types’

class Mouse extends React.Component { constructor(props) { super(props) this.state = { x: 0, y: 0 } }

handleMouseMove = (event) => {
  this.setState({
    x: event.clientX,
    y: event.clientY
  })
}
render() {
  return (
    <div onMouseMove={this.handleMouseMove}>
        {/* 将当前 state 作为 props ，传递给 render （render 是一个函数组件） */}
        {this.props.render(this.state)}
    </div>
  )
}

} Mouse.propTypes = { render: PropTypes.func.isRequired // 必须接收一个 render 属性，而且是函数 }

const App = (props) => (

</div>