el-upload 手动上传

<el-upload
        class="avatar-uploader"
        action=""
        ref="upload"
        :http-request="handleFileUpload"
        :show-file-list="false"
        :file-list="fileList"
        :before-upload="handleBeforeUpload">
        <span class="btn">上传</span>
    </el-upload>

<script lang="ts" setup>
let fileList = ref([])
// succuss 、error 在手动上传模式下不能触发钩子
const handleBeforeUpload = (file)=>{
    fileList.value = [file]
    let fileState = false
    let raw = file
    if(raw.type.indexOf('.document')>-1){
        fileState = true
    }else{
        ElMessage.error('请上传doc、docx格式的文件!'); 
        fileState = false
        return false
    }
    const isLtSize = raw.size / 1024 / 1024 < 25;
    if (!isLtSize) {
        ElMessage.error('上传的文件大小不能超过 25MB!');
        return false
    }
    return fileState&&isLtSize
}
const handleFileUpload = (param)=>{
      const formData = new FormData()
      formData.append('file', param.file)
      uploadDoc(formData).then(res => {
          if(res.code===200){
              ElMessage.success(res.message)
              emit('updateFile')
          }
      }).catch(err=>{
      })
}
</script>