取消从输入加载图像

Question

我有一个用react下载图像的输入，例如，如果我改变主意，我希望能够取消已经下载的内容。那么，如何将输入返回到其初始状态，即空？谢谢你的帮助。

const [ imageUrl, setImageUrl ] = useState(null);
const uploadImage = (e) =>{
const file = e.target.files[0]; 
setImageUrl(file)
}
const cancelImage = (e) =>{
e.preventDefault();
setImageUrl(null)
}

<label htmlFor="Image du produit">
Image du produit:
<input id="uploadImage" type="file" onChange={uploadImage}/>
<button onClick={cancelImage}>X</button>
</label>

Answer 1

在react中使用ref来访问输入元素。现在，当您单击按钮时，使用我们附加的ref将输入的值设为空("(。