javascript - react 输入类型文件 onChange 不触发

Question

在本地开发服务器上使用 React v16.1。我有一个简单的组件可以在这里上传文件:

class FileImporter extends React.Component {
    constructor(props) {...}
    importFile(e) {
      // import the file here, not firing
    }
    render() {
      return (<input type="file" onChange={this.importFile.bind(this)} />);
    }
}    

importFile 函数永远不会触发。我尝试通过以下方式绑定(bind) onChange:

onChange={e => this.importFile(e)}
onChange={this.importFile.bind(this)}
onChange={this.importFile}

我已经尝试使用 react-file-reader-input 和 react-file-reader，并且只是像代码片段中那样的原始输入标签。它们都不会触发 onChange 处理程序。系统文件上传对话框出现，但在选择文件时没有任何反应。如何触发 onChange 事件？

Answer 1

对于在这里谷歌的其他人:我有一个类似的问题，我找到的解决方案是我的 <input>单击按钮打开文件选择器后，已从 DOM 中删除。 (它在下拉列表中。)

单击输入仍然会显示文件选择器，但这也会导致下拉菜单隐藏，从而从 DOM 中删除输入。选择文件后，onChange 从未触发。我将输入移到了一个不会从 DOM 中删除的位置，一切又开始正常工作了。