ant design for vue 上傳文件

1、使用customRequest

customRequest 通過覆蓋默認的上傳行為，可以自定義自己的上傳實現 Function

定義customRequest，之前定義action行為會被覆蓋，可以注釋掉

<a-upload
        name="file"
        :multiple="false"
        @change="changeFile"
        :customRequest="customRequest"
      >
        <a-button type="primary"> <a-icon type="upload" />導入Excel</a-button>
</a-upload>

　

changeFile(info) { // 上傳文件
        if (info.file.status !== 'uploading') {
          console.log(info.file, info.fileList);
        }
        if (info.file.status === 'done') {
          this.$message.success(`${info.file.name} 上傳成功`);
        } else if (info.file.status === 'error') {
          this.$message.error(`${info.file.name} 上傳失敗.`);
        }
 },

customRequest(data){ // 上傳提交
  const formData = new FormData() 
 formData.append('file', data.file)
 formData.append('token', "token")

  this.saveFile(formData)

},
saveFile (formData) {

this.axios({
  method: 'post',
  url: '/api/saveFile',
  headers: {
  },
  params:{
  },
  data: formData
}).then((response) => {
    console.log(response)
  }).catch(function (error) {
    console.log(error)
  })

},