reactjs – 使用HOC与组件包装之间的区别

高阶组件

这个简单的HOC将状态作为属性传递给ComposedComponent

const HOC = ComposedComponent => class extends React.Component {

    ... lifecycle,state,etc;...

    render() {
      return (<ComposedComponent {...this.state} />);
    }      

}

组件包装

此组件将state作为属性传递给子组件

class ParentComponent extends React.Component {

    ... lifecycle,etc;...

    render() {
      return (
        <div>
          {React.cloneElement(this.props.children,{ ...this.state })}  
        </div>
      );
    }      

}

尽管两者之间的使用略有不同，但它们似乎都可以重复使用。

通过this.props.children，HOC和组成组件之间的真正区别在哪里？是否有例子只能使用其中一个？使用HOC是一种更好的做法。这些只是您选择自己喜欢的味道的选择吗？