使用高阶组件就是用来替代Mixins吗？我查询了网上的资料都说高阶组件的核心思想是拓展组件的功能方法，但是最后拓展的新props或者state不都还是要传给最底层的控件去实现吗？这样不觉得很奇怪吗？明明是拓展后的组件才有的props或者state，但是却需要最底层的组件来实现（难道我每次拓展新props都还要回到最底层去关心怎么实现吗？或者要提前规划好被拓展的组件我以后要怎么拓展？）

//TestComponent.js
/* 比如先定义一个组件，这个组件一开始就要考虑到hide属性？这不可能吧，这个hide是后来才拓展出来的 */
var React = require('react');
 
module.exports = React.createClass({
    render: function() {
        var className = this.props.hide? "h5-widget-hide" : "";
        return (
            <p className = {className}>this.props.text</p>
        );
    }
});

//HideWidgetHOC.js
//这个HOC用于点击隐藏控件
var Test = require('./components/TestComponent');
var React = require('react');
var ReactDOM = require('react-dom');
 
var hoc = function (ComponentClass) {
    return React.createClass({
        getInitialState: function() {
            hide: false
        },
  
        componentDidMount: function() {
            var that = this;
            BaseUtils.createClickEvent($(ReactDOM.findDOMNode(this)), function(e) {
                that.setState({
                    hide: !this.state.hide
                });
            });
        }, // 绑定一个点击事件
 
        render: function() {
            var that = this;
            //给原组件拓展了点击隐藏功能。
            var newProps = Object.asign({}, {this.props}, {hide: that.getHideState()});//明明是新拓展的state，最后却需要到原来被拓展的组件中去考虑怎么实现？不觉得很奇怪吗？
            return <ComponentClass {...this.newProps}/> ;
        },
  
        getHideState: function() {
            return this.state.hide;
        }
    });
};
 
var XX = hoc(Test);
 
ReactDOM.render(<XX text="HelloWorld"/>, document.getElementById('p'));

难道我以后再拓展什么属性都又要回到最下面的组件去实现？