|
|
@ -1,28 +1,27 @@ |
|
|
|
class FileInput extends React.Component { |
|
|
|
// highlight-range{4}
|
|
|
|
constructor(props) { |
|
|
|
// highlight-range{3}
|
|
|
|
super(props); |
|
|
|
this.handleSubmit = this.handleSubmit.bind(this); |
|
|
|
this.fileInput = React.createRef(); |
|
|
|
} |
|
|
|
// highlight-range{4}
|
|
|
|
handleSubmit(event) { |
|
|
|
// highlight-range{4}
|
|
|
|
event.preventDefault(); |
|
|
|
alert( |
|
|
|
`Selected file - ${this.fileInput.current.files[0].name}` |
|
|
|
`Selected file - ${ |
|
|
|
this.fileInput.current.files[0].name |
|
|
|
}` |
|
|
|
); |
|
|
|
} |
|
|
|
|
|
|
|
render() { |
|
|
|
// highlight-range{5}
|
|
|
|
return ( |
|
|
|
<form onSubmit={this.handleSubmit}> |
|
|
|
<label> |
|
|
|
Upload file: |
|
|
|
{/* highlight-range{1-3} */} |
|
|
|
<input |
|
|
|
type="file" |
|
|
|
ref={this.fileInput} |
|
|
|
/> |
|
|
|
<input type="file" ref={this.fileInput} /> |
|
|
|
</label> |
|
|
|
<br /> |
|
|
|
<button type="submit">Submit</button> |
|
|
|