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)
}) },

  

ant design for vue 上传文件的更多相关文章

  1. Ant Design Upload 组件上传文件到云服务器 - 七牛云、腾讯云和阿里云的分别实现

    在前端项目中经常遇到上传文件的需求,ant design 作为 react 的前端框架,提供的 upload 组件为上传文件提供了很大的方便,官方提供的各种形式的上传基本上可以覆盖大多数的场景,但是对 ...

  2. vue 上传文件 和 下载文件

    Vue上传文件,不必使用什么element 的uplaod, 也不用什么npm上找的个人写的包,就用原生的Vue加axios就行了, 废话不多说,直接上代码:html: <input type= ...

  3. vue 上传文件 和 下载文件 面试的时候被问到过

    Vue上传文件,不必使用什么element 的uplaod, 也不用什么npm上找的个人写的包,就用原生的Vue加axios就行了, 废话不多说,直接上代码:html: <input type= ...

  4. axios+Vue上传文件显示进度

    一,前言 最近在用Vue,然后上传文件时需要显示进度,于是网上搜了一下,经过自己实测终于也弄明白了 二,效果 三,代码 HTML代码 <div id="app"> &l ...

  5. vue上传文件

    <div> <input type="file" class="file" name="file" @change=&qu ...

  6. vue+上传文件夹

    在做项目开发的时候,上传东西无论文件也好,还是文件夹都需要用到 <input type="file" id="filepicker" name=" ...

  7. vue 上传文件 并以表格形式显示在页面上

    先上代码 <label for="file" class="btn">多文件上传</label> <input type=&quo ...

  8. Vue上传文件:ElementUI中的upload实现

    一.上传文件实现 两种实现方式: 1.直接action <el-upload  .利用before-upload属性 此种方式有个弊端,就是action是必选的参数,那么action如果和pos ...

  9. [自动运维]ant脚本打包,上传文件到指定服务器,并部署

    1.根节点使用,表示根目录为当前目录,默认启动的target为build,项目名称为othersysm, <project basedir="." default=" ...

随机推荐

  1. 前台图片Canvas压缩上传小结

    需求来源:之前有个提交审核表单的业务,表单中含有大量附件图片,大约有20多张吧,为了省事,采用的同步上传,一次需要上传很多照片,本来单张图片限制为200KB,这样子总图片大小约为5MB左右,想想也可以 ...

  2. 如何搞定Critical Thinking写作?

    受中国传统教育模式与国外一流大学之间的差异的影响,在海外留学的学子们常常会在新的学习生活中面临许多难题,Critical Thinking就是其中之一.国内的教育方法常常以灌输式的教育模式为主,忽略了 ...

  3. tensorflow应用于手写数字识别(第二版)

    import tensorflow as tf from tensorflow.examples.tutorials.mnist import input_data#载入数据集 mnist = inp ...

  4. c# 异步和同步 多线程

    在执行较为耗时的处理时,很容易出现用户界面“卡顿”现象,用异步编程模型,将耗时处理的代码放到另一个线程上执行,不会阻止用户界面线程的继续执行,应用程序 就不再出现“卡顿”现象. 本例子提供同步加载和异 ...

  5. 在Linux下 MySQL错误 ERROR 1045 (28000): Access denied for user 'root'@'localhost' (using password: YES) 解决办法【很管用】

    一般这个错误是由密码错误引起,解决的办法自然就是重置密码. 假设我们使用的是root账户. 1.重置密码的第一步就是跳过MySQL的密码认证过程,方法如下: #vim /etc/my.cnf(注:wi ...

  6. 一名资深架构师规划Java程序员五年职业生涯指南

    每个程序员.或者说每个工作者都应该有自己的职业规划,如果你不是富二代,不是官二代,也没有职业规划,希望你可以思考一下自己的将来.今天我给大家分享的是一篇来自阿里大牛对五年工作经验程序员的职业建议,希望 ...

  7. like not like 优化

    instr(title,’手册’)>0 相当于like instr(title,’手册’)=0 相当于not like 对于LIKE语句,我们可以使用instr函数来进行SQL调优

  8. Java语言概述-JavaSE

    代码虐我千百遍,我视代码如初恋 初级学习思想: 先了解Java 下载中英文文档对照学习 多看,多学 多敲,狂练 多标注注释 总结—创造 https://baike.baidu.com/(Java百度百 ...

  9. SQL基础教程(第2版)第5章 复杂查询:5-2 子查询

    第5章 复杂查询:5-2 子查询 ● 一言以蔽之,子查询就是一次性视图( SELECT语句).与视图不同,子查询在SELECT语句执行完毕之后就会消失.● 由于子查询需要命名,因此需要根据处理内容来指 ...

  10. 27. docker compose 单机 均衡负载

    1.编写Dockerfile #Dockerfile FROM python:2.7 LABEL maintaner="eaon eaon123@docker.com" COPY ...