良好的文档资料和示例摘自此处,解释了您要做什么.
https://reactjs.org/docs/uncontrolled-components.html#the-file-input-tag
React.JS包含要使用的特定文件API.
以下示例显示如何创建对DOM节点的引用以访问提交处理程序中的文件:
HTML
React.JS
class FileInput extends React.Component {
constructor(props) {
super(props);
this.handleSubmit = this.handleSubmit.bind(this);
this.fileInput = React.createRef();
}
handleSubmit(event) {
event.preventDefault();
alert(
`Selected file - ${
this.fileInput.current.files[0].name
}`
);
}
render() {
return (
Upload file:
Submit
);
}
}
ReactDOM.render(
,document.getElementById('root')
);
Alert Filename
alert(`Selected file - ${this.fileInput.current.files[0].name}`);
引用:React.JS文档| Examples