input 上传文件 判断重名限制文件个数

//原生文件上传 accept快捷上传.xls .xlsx格式
//文件上传表单的提交方式必须是“post” 编码类型必须为：enctype=“multipart/form-data”
//上传多个文件属性 multiple

<input type="file" style="display:none;" id="file" multiple @change="changeFile($event)" accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" name="multipartFiles"/>
    <label for="file" class=" btn btn-default uploadChange
">
    选择上传文件
</label>

//方法

async changeFile(){
    console.log('导入多文件')
    var filrarr = document.getElementById("file").files;
    console.log(filrarr,'filrarr')
    //单次导入大于20个文件  先文件名去重
    var formdata = new FormData();//创建一个表单
    if(20-this.filesTable.length<filrarr.length){
        alert('最多只能上传20个文件')
    }
    for(var i = 0; i <filrarr.length; i++){
        if(this._.some(this.filesTable,x=>x.fileName==filrarr[i].name)){
            this.$message.error('文件名称已存在')
        }else if(filrarr[i].size>50*1024 * 1024&&i<20-this.filesTable.length){
            this.disabled = false
            console.log(filrarr[i])
            this.fiveFileList.push({
                'status': 2,
                'fileName': filrarr[i].name,
                'msg':'上传文件超过限制大小,最大不能超过50MB'
            })
        }else if(i<20-this.filesTable.length){
            let endText = /\.[^\.]+$/.exec(filrarr[i].name)[0]
            console.log(endText)
            if(endText=='.xls'||endText=='.xlsx'){
                this.formdata.push(filrarr[i])
            }else{
                this.$message.error('只支持.xls,xlsx格式文件')
            }
        }
    }
    this.formdata.forEach(x=> {
        formdata.append("files", x)
    })
    let res = await this.$Http.importExcalFile(formdata)
    if(res) {
        this.filesTable = []
        if(this.fiveFileList.length>0){
            console.log(this.filesTable, this.fiveFileList)
            this.fiveFileList.map(x=>{
                this.filesTable.push(x)
            })
            this.fiveFileList = []
        }
        if(this.filesTable.length>0){
            res.forEach(x=> this._.some(this.filesTable,y=>x.fileName!=y.fileName||x.msg=='申请单编号重复'?this.filesTable.push(x):this.$message.error('文件名称已存在')))
        }else{
            res.forEach(x => this.filesTable.push(x))
        }
        this.tableListNum()
        this.disabled = false
        this.fileloading = false
    }
    document.getElementById('file').value = null   
},

文件夹上传，拖拽上传参考：https://www.cnblogs.com/dearxinli/p/8422140.html