Sometimes, we want to allow users to select the same file more than once in a React component.
In this article, we’ll look at how to allow users to select the same file more than once in a React component.
Allow File Input to Select the Same File in React Component
We can let a file input select the same file in a React component if we set it to null after we click on it.
For instance, we can write:
<input
id="upload"
ref="upload"
type="file"
accept="image/*"
onChange={(event)=> {
this.readFile(event)
}}
onClick={(event)=> {
event.target.value = null
}}
/>
We have the onChange prop that takes a function to read a file.
In the onClick prop, we set the file input value to null .
Passing a Number to a Component
We can pass a number to a component by passing in a number in curly brackets.
For instance, we can write:
Rectangle width={10} height={20} />
Conclusion
We can let a file input select the same file in a React component if we set it to null after we click on it.
