element ui檔案上傳，自定義上傳，單個檔案覆寫上傳

HTML

<el-upload
                ref="upload"
                :http-request="uploadFile"
                :auto-upload="true"
                :show-file-list="true"
                :on-success="upLoadSuccess"
                :on-remove="removeFile"
                :on-change="handleChange"
                :file-list="fileList"
                class="upload-merge-template"
                accept=".docx"
                action=""
                drag>
                <i class="el-icon-upload"/>
                <div class="el-upload__text">将檔案拖到此處，或<em>點選上傳</em></div>
  <div class="el-upload__tip" slot="tip">隻能上傳docx檔案，且不超過10MB</div>
              </el-upload>
           

Script

<script>
import { addMergeDocTemplate, uploadWord } from '@/api/management'

export default {
  name: 'typeDialog',
  data() {
    return {
      formData: {},
      initFormData: {
        url: '',
        name: '',
        type: 1,
        sort: 1
      },
      fileList: []
    }
  },
  mounted() {
    this.formData = { ...this.initFormData }
  },
  methods: {
    ok() {
      addMergeDocTemplate(this.formData).then((res) => {
         if (res.code === '000000') {
            this.$message.success(res.msg)
         }
      })
    },
    // 檔案上傳
    uploadFile(file) {
      const _file = file.file
      const isLt10M = _file.size / 1024 / 1024 < 10
      // 通過 FormData 對象上傳檔案
      var formData = new FormData()
      formData.append('multipartFile', _file)
      formData.append('module', 'merge_doc')
      if (!isLt10M) {
        this.$message.error('請上傳10M以下的.docx檔案')
        return false
      }
      this.$refs['upload'].clearFiles()
      // 發起請求
      uploadWord(formData).then(res => {
        if (res.code === '000000') {
          this.formData.url = res.data.url
        } else {
          this.$message({
            type: 'warning',
            message: res.msg
          })
        }
      })
    },
    upLoadSuccess() {
      // 拿到upload的dom
      this.$refs.upload.clearFiles()
    },
    handleChange(file, fileList) {
      if (fileList.length > 0) {
        this.fileList = [fileList[fileList.length - 1]]
      }
    },
    removeFile() {
      this.formData.url = ''
    },
  }
}
</script>