相关疑难解决方法(0)

注意:此帖已在React不支持ES6(v12)时发布.

我有一个ES6课程:

class BaseClass {
  getInitialState(){
      return {message: 'Hello!'};
  }

  render() {
      return (
            <div>
                <div>{this.state.message}</div>
            </div>
        )
  }
}

我可以使用这个表达式在ES6中导出(来源:反应ES6 browserify)

export default React.createClass(BaseClass.prototype)

这很好用.现在我想使用ES6继承来扩展我的BaseClass类:

class ExtendedClass extends BaseClass{
    getInitialState(){
        return {message: "Hello! I'm an extension"};
    }
}

但是当我React.createClass在ExtendedClass课堂上打电话时,我得到以下异常:

Invariant Violation: ReactCompositeComponentInterface: You are attempting to define `constructor` on your component more than once. This conflict may be due to a mixin.

我知道React 0.13应该更符合ES6,但有没有办法解决这个问题？

编辑:

我正在使用Traceur来编译我的ES6类.输出ExtendedClass看起来像:

function ExtendedClass() …

我知道我的问题有点偏颇，但我对 Javascript 和prototypes. 所以一个例子会非常有帮助。所以我有一个React组件，它基本上是这样的：

var Component1 = React.createClass({

getInitialState: function () {
        return ({
            searchable: true,
        })
    },

function1: function () {
        return ({
            somevalue
        })
    },

render: function () {

        var redText = {
            color: 'red'
        };

        var redBorder = {
            color: 'red',
            border: '1px solid red'

        };

        return (
                <form>
                    <div>
                        <a onClick={this.props.handleAddClick}>Something</a>
                    </div>

                    <div>
                        <label>Some label</label>
                        <input type="text"/>
                    </div>
               </form> ) 
});

我也有Component2which 基本上完全相同，但<input/>在return其render功能内部增加了一个。

我也有 …