如何使用 react-dropzone

编程问答 2022-05-03

问题描述

我需要在一个组件中使用 2 个不同的 dropzones 来使用 useDropeZone 版本存储 2 个不同的文件。 我正在尝试使用 onDropAccepted 并使用输入 ID 检索事件...但 ID 永远不会改变。

我有 2 个类似的 dropezone :

<div {...getRootProps({style})}>
<input id={'new_logo_input'} {...getInputProps()} />
<p>Drop logo (jpg,png)</p>
</div>
<div {...getRootProps({style})}>

<input id={'new_stamp_input'} {...getInputProps()} />
<p>Drop stamp (jpg,png)</p>
</div>

并像这样使用DropeZone :

const { fileRejections,getRootProps,getInputProps,isDragActive,isDragReject,isDragAccept} = useDropzone({
onDropAccepted: (files,event)=>{
console.log(files,event.target.id )
}
})

但是 event.target.id 总是返回 'new_stamp_inout'.....!!!

有人可以帮我吗？

非常感谢

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

react-dropzonereactjsreactjsreactjsreactjs