You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
35 lines
1.2 KiB
35 lines
1.2 KiB
2 years ago
|
# 文件上传控件多次选择文件和自定义校验
|
||
|
|
|
||
|
|
在使用FineUI中上传文件控件的时候,如果想要自定义文件校验规则怎么办呢?
|
||
|
|
|
||
|
|
```javascript
|
||
|
|
const file = {
|
||
|
|
type: "bi.file",
|
||
|
|
multiple: true,
|
||
|
|
accept: ".png,.pdf,image/jpg,image/*",
|
||
|
|
maxSize: 1024 * 1024, // 最大文件大小
|
||
|
|
maxLength: 3, // 最大文件个数
|
||
|
|
errorText: function (error) {
|
||
|
|
return "上传失败啦";
|
||
|
|
},
|
||
|
|
listeners: [{
|
||
|
|
eventName: "EVENT_CHANGE",
|
||
|
|
action: function (obj) {
|
||
|
|
// 可以对文件进行处理及判断
|
||
|
|
const files = obj.files;
|
||
|
|
const invalid = files.some(file => {
|
||
|
|
if (/image/.test(file.type) && file.size > 1024 * 10) {
|
||
|
|
BI.Msg.toast(`${file.type}类型文件不允许超过10KB`, { level: "error" });
|
||
|
|
return true;
|
||
|
|
}
|
||
|
|
});
|
||
|
|
// 可选的是否清空掉上次上传的内容
|
||
|
|
file.reset();
|
||
|
|
!invalid && file.upload();
|
||
|
|
}
|
||
|
|
}]
|
||
|
|
};
|
||
|
|
```
|
||
|
|
|
||
|
|
file组件在选择文件后,会触发`EVENT_CHANGE`事件,对外抛出的参数包含所选文件列表,我们可以对这些内容进行筛选处理,进行自定义校验等操作
|