反应 onInput - IE9/10 event.target.value 为空？

Question

当“onInput”用作侦听事件时（在 IE9/10 中），简单的受控输入不会根据用户输入更新值。 "onChange" 可以正常工作，但是为了解决在 IE11 中粘贴值的问题，我们选择了 "onInput" 作为我们的事件。

class TestComp extends React.Component {
  constructor(props){
    super(props);
    this.state = { value: "" };
    this.updateValue = this.updateValue.bind(this);
  }

  render(){
    return <input onInput={this.updateValue} value={this.state.value} />;
  }

  updateValue(evt){
    this.setState({ value: evt.target.value });
  }
};

https://codepen.io/anon/pen/KmJPGR

这是对受控输入的不当实现吗？如果是，如何解决？如果没有，有哪些替代方案？

Answer 1

我仍然会使用onChange，尽管我现在无法对其进行测试。我听说onInput 在IE9 上存在一些问题。 根据 React 文档：

对于<input> 和<textarea>，onChange 将被取代——通常应该使用而不是 DOM 的内置 oninput 事件处理程序。

如何在 IE11 中为 onChange 创建修复而不是使用其他侦听器？ 虽然我不建议这样做，但可能同时使用onChange 和onInput。请记住，Chrome 会触发这两个调用，所以我建议仅在 userAgent 匹配时传递 onInput。

我还发现这个 polyfill 修复了其中一些问题（删除、清除、剪切值）但无法对其进行测试：https://github.com/buzinas/ie9-oninput-polyfill。