如何解决maxFiles 在 react-admin 中不起作用 - dropZone
我试过对react-dropzone构建的react-admin的ImageInput设置文件限制,有两种方式,第一种是直接将** maxFiles **作为属性传递:
<ImageInput
className={classes.dropZone}
source="images"
label=""
accept="image/*"
multiple
maxSize={1000000}
maxFiles={2}
placeholder={
<p>Cargar imagen/es<br/><br/><br/>
<span >
*El archivo no debe exceder 1MB de tamaño
</span>
</p>
}>
<ImageField source="src" title="title"/>
</ImageInput>
第二个是通过 ** options ** 传递它,这也不起作用。
<ImageInput
className={classes.dropZone}
source="images"
label=""
accept="image/*"
multiple
maxSize={1000000}
options={{ maxFiles:2 }}
placeholder={
<p>Cargar imagen/es<br/><br/><br/>
<span >
*El archivo no debe exceder 1MB de tamaño
</span>
</p>
}>
<ImageField source="src" title="title"/>
</ImageInput>
有人知道我该如何解决吗?或者其他限制可以上传的文件数量的方法?
非常感谢
解决方法
我猜您使用的是旧版本的 react-dropzone
。
最简单的方法是更新版本。(最新版本是11.3.0)
如果你想对版本做同样的事情,你可以尝试像这样使用 onDrop
道具手动管理。
onDrop={acceptedFiles => {
// do nothing if no files
let handleDropImages;
if (acceptedFiles.length === 0) {
return;
} else if(acceptedFiles.length > 5){ // here i am checking on the number of files
return notify('maxImages'); // here i am using react toaster to get some notifications. don't need to use it
}else {
// do what ever you want
}
}}
你可以参考这个issue
,您可以使用验证道具来解决。
const maxFiles = () => (
value => value && value.length > 10 ? "Max number of files exceeded" : undefined;
<ImageInput
className={classes.dropZone}
source="images"
label=""
accept="image/*"
multiple
maxSize={1000000}
validate={maxFiles()}
placeholder={
<p>Cargar imagen/es<br/><br/><br/>
<span >
*El archivo no debe exceder 1MB de tamaño
</span>
</p>
}>
<ImageField source="src" title="title"/>
</ImageInput>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。