- 起因是我需要实现一个上传的校验功能:单次操作最多上传10个文件,每个文件大小不超过100M
- 业务背景是:选文件,自动上传,我调一个上传的接口服务,把上传的文件传到一个文件服务器,然后通知我这里的后端,去文件服务器取相应的文件
- 前端背景是:文件服务有相应的SDK,已经整合element ui的上传组件,封装了一个新的前端组件,选多个文件,一个一个上传(这个组件不是我封装的,而且已经大批量使用了,虽然我觉得封装的不对)
使用闭包可以使这个需求的功能实现高内聚
javascript
handleBeforeUpload(file) {
return new Promise((resolve, reject) => {
const timer = function(__this) {
let sizeUnValid = false
let fileCount = 0
return function(timeFile, __resolve, __reject) {
fileCount++
if(timeFile.size > 100*1024*1024) sizeUnValid = true
setTimeout(() => {
__this.__uploadTimer = null
if(sizeUnValid || fileCount) {
this.$message(sizeUnValid ? '有文件超过100M' : '文件超过10个' )
__reject()
} else {
__resolve()
}
}, 300)
}
}
if(!this.__uploadTimer) this.__uploadTimer = timer(this)
this.__uploadTimer(file, resolve, reject)
})
}