upload上传 http-request自定义

qq_41985405

于 2024-01-23 14:29:14 发布

阅读量527

点赞数 9

文章标签： http javascript 前端

本文链接：https://blog.csdn.net/qq_41985405/article/details/135770892

版权

<el-upload :show-file-list="false" accept=".xlsx" :http-request="httpRequest">
     <el-button type="default">导入</el-button>
</el-upload>

httpRequest(file) {
      const formData = new FormData()
      formData.append('file', file.file)
      importDeviceTroubleOrder(formData).then(res => {
        console.log(res)
        if (res.headers['content-type']) {
          this.download('', new Blob([res.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8' }), '有数据导入异常')
          this.getTableData()
        } else {
          this.getTableData()
          this.$message.success('导入成功！')
        }
      }).catch((error) => {
        console.log(error)
      }).finally(() => {
        console.log('finally')
      })
    },
download(name, blob, message) {
      try {
        const urlObject = window.URL || window.webkitURL
        const link = document.createElement('a')
        link.href = urlObject.createObjectURL(blob)
        link.download = name
        link.click()
        this.$message.info(message ? message : '导出成功！')
      } catch (err) {
        console.log(err)
        this.$message.error('导出失败！')
      }
    },
// 导入
function importDeviceTroubleOrder(data) {
  return http({
    method: 'post',
    url: '',
    data,
    responseType: 'blob'
  })
}