javascript - 表单 onSubmit 方法在 react.js 中不起作用

Question

在我的 react.js 应用程序中未触发表单 onSubmit 方法 (_updateThing)。
源代码如下。
我觉得这个问题很简单，但我花了很多时间检查它，无法解决它。请帮助我。
我的代码有什么问题:

export default React.createClass({
  displayName: 'ThingContainer',
  statics: {
    load: function (context) {
      return ThingActions.getData(context);
    }
  },
  mixins: [ContextMixin, MaterialRebindMixin],
  getInitialState() {
    return getThings();
  },
  _updateThing(e) {
    alert(1);
    e.preventDefault();
  },
  _setChangedText(event) {
    alert('change');
  },
   render() {
    return (
        <div>
          <div>
            <div>
              <h2>Title</h2>
            </div>
            <form  onSubmit={this._updateThing}>
              <div >
                <Label htmlFor="changeQuantity" text="" />
                <Input id="changeQuantity" name="changeQuantity" type="text" onChange={this._setChangedText}  />
              </div>
              <div className="form-footer">
                <div style={{float: 'right'}}>
                  <input type="submit" value="submit" />
                </div>
              </div>
            </form>
          </div>
        </div>
    );
  }
});

我将“form onSubmit={this._updateThing}”更改为“form onSubmit={this._updateThing.bind(this)}”，但没有任何改变。
我还使用 Chrome 开发控制台检查 html 源代码，html 源代码中未显示 onSubmit 方法 (_updateThing)。
Capture
提前致谢。

Answer 1

问题是 this 的上下文没有被保留。如果您正在使用 React.createClass，this 会自动绑定(bind) (source)，如果您是 React 开发人员转向 ES6 类，这可能会让您陷入循环。使用 ES6 类构造函数语法，情况并非如此，您必须在适当的时候绑定(bind)自己的方法。最常见的做法是在 JSX 中 bind(this)。

例如，代替
onSubmit={this._updateThing}

尝试
onSubmit={this._updateThing.bind(this)}