如果destructure阻止默认 - 与babel反应 - 这是未定义的

Question

我刚吃了最疯狂的虫子.在我的onKeyDown我毁灭preventDefault了e.但是当我打电话的时候preventDefault()我会得到:

TypeError:这是未定义的[了解更多] react-dom.js:13987:5

我正在使用React v15.4.1,并在下面的屏幕截图中突出显示该行:

如果我不进行破坏,只是使用e.preventDefaut()它.有人知道为什么吗？这是巴贝尔的一个错误吗？

const El = React.createClass({
  displayName: 'El',
  onKeyDown(e) {
    let { key, preventDefault } = e;
    preventDefault();
  },
  render() {
    return React.createElement('input', { onKeyDown:this.onKeyDown });
  }
});

Answer 1

preventDefault方法的实现取决于事件对象的其他属性,它们由this(即:this.defaultPreventedproperty)引用.从中解构它时e,将此函数与基础e对象分离,这意味着您松散了上下文this.preventDefault需要使用正确的e对象上下文正确调用方法.您可以通过使用event您可以执行的上下文调用来确认Function.prototype.call:

onKeyDown(e) {
  let { key, preventDefault } = e;
  preventDefault.call(e);
},

我不会破坏preventDefault.