element 上传组件不立即上传如何判断文件类型(auto-upload=‘false‘)，accept不能完全限制上传文件格式

element 上传组件不立即上传如何判断文件类型(auto-upload=‘false‘)，accept不能完全限制上传文件格式

问题

accept不能完全限制上传文件格式

使用accept虽然可以在拖拽上传时避免传入其他文件，但是使用点击上传时无法做到完全过滤。
点击全部就可以对所有类型文件进行上传！

如图，选择所有文件就可以对所有格式的文件进行上传！

auto-upload='false’时不能使用before-upload钩子

实现代码

组件代码

	<el-upload
        drag
        action="/"
        accept=".txt"
        :auto-upload="false"
        :file-list="fileList"
        :on-change="onChangeFile"
      >
        <i class="el-icon-upload" />
        <div class="el-upload__text">
          将.txt格式的文件拖到此处，或<em>点击上传</em>
        </div>
      </el-upload>

方法代码

	// 判断文件类型方法
	onChangeFile(file, fileList) {
      if (file.name.split('.').pop() !== 'txt' && file.name.split('.').pop() !== 'TXT') { // 类型有可能大写，记得要写
        fileList = []
        this.fileList = []
	    this.$message({
	      message: '请上传.txt格式的文件',
	      type: 'error'
	    })
      } else {
        this.fileList = fileList.length > 0 ? [file.raw] : []
      }
    },
    // 上传方法
   	async onSubmit() {
        const formData = new FormData()
        formData.append('file', this.fileList[0])
        const res = await this.$api.xxxx.xxxx(formData) //后端接口
    },

完