sunDrapUploader
性能:文件拖拽组件
https://github.com/allensunjian/sunDrapUploader/tree/master
实现接口:
- getFile 文件读取完结返回文件信息
- fileAreaEnter 文件进入拖拽区域
- fileAreaLeave 文件来到拖拽区域
- filePageEnter 文件进去拖拽页面(未进入拖拽区域)
- eventTirrger 谬误回调函数
配置:
| 字段 | 类型 | 默认值 | 性能
| — | — | — | — |
| target | string | null | 指定触发元素
| rules | object | {} | 定义文件验证规定
| errFileFilter| boolean | false | 是否开启文件验证过滤
| fileType| string | ‘file’ | 指定文件类型
rules 配置
| 字段 | 类型 | 默认值 | 性能
| — | — | — | — |
| fileCount | number | infinit | 文件数量束缚
| maxSize | number | infinit| 文件大小束缚(最大值)单位: bit
| minSize| number | infinit | 文件大小束缚(最小值)单位: bit
| fileType| Array | null | 文件类型束缚
实例:
new sunDrapUploader({
target:"drag",
rules: {
fileCount: 10,
maxSize: 1024 * 1024,
minSize: 10,
fileType: ["doc", "docx", "pdf", "txt"]
},
errFileFilter: true,
fileType: "file",
getFile: function (files, count) {
// files 文件,开启了 errFileFilter 之后 files 返回一个对象
// 蕴含 acrossFiles 字段(验证通过的 文件列表)verErrFiles 字段(验证未通过 文件列表)// files 阐明见【files 字段阐明】},
fileAreaEnter: function () {// 进入拖放区域},
fileAreaLeave: function () {// 来到拖放区域},
filePageEnter: function () {// 进入拖拽页面(未进入拖放区域)},
eventTirrger: function (err) {
// 字段阐明同【errList 字段阐明】console.log(err);
// 返回错误信息
}
})
files 字段阐明
| 字段 | 类型 | 默认值 | 性能
| — | — | — | — |
| file | File | 无 | 文件
| fileName | string | 无 | 文件名称
| fileSize| number | 无 | 文件大小 单位: bit
| fileType| string | 无 | 文件类型
| readedState| boolean | 无 | 文件读取是否胜利
| verMsg| object | 无 | 文件验证信息对象
verMsg 字段阐明
| 字段 | 类型 | 默认值 | 性能
| — | — | — | — |
| errList | Array | 无 | 文件验证错误信息
| verState | string | 无 | 文件验证状态 2 通过 0 未通过(未通过时 errList 蕴含错误信息)
errList 字段阐明
| 字段 | 类型 | 默认值 | 性能
| — | — | — | — |
| errList | Array | 无 | 文件验证错误信息
| errType | string | 无 | 文件谬误类型同 rules 配置
| rule | any | 无 | 定义的规定
| value | any | 无 | 文件的值(不合乎 规定 rule 的值)