vue2 的版本 使用 Ant Design Vue 1.78版本的组件库 做自定义接口 调用后端的接口上传excel文件

话不多说 上代码

html 复制代码
<a-upload
style="margin-left: 8px"
:before-upload="beforeUpload"
:showUploadList="false"
:multiple="false"
:headers="tokenHeader"
>
   <a-button> <a-icon type="upload" /> 导入 </a-button>
</a-upload>

提示内容可以根据自己的来

formData是二进制文件流传给后端的

exportUser:后端提供的接口

javascript 复制代码
   
import { Modal} from 'ant-design-vue'

beforeUpload(file) {
      const formData = new FormData()
      formData.append('file', file)
      exportUser(formData).then((res) => {
        if (res.code == 200) {
          Modal.success({
            title: '系统提示',
            content: res.message,
            okText: '知道了',
          })
        } else {
          Modal.error({
            title: '系统提示',
            content: res.message,
            okText: '知道了',
          })
        }
      })
      this.getList()
      return false
    },
javascript 复制代码
export function exportUser(data){
  return axios({
    url: '/schedule/createImport',
    data: data,
    method:'post',
  })
}
相关推荐
光影少年3 分钟前
React vs Next.js
前端·javascript·react.js
谢尔登5 分钟前
Vue3 响应式系统——ref 和 reactive
前端·javascript·vue.js
天若有情6735 分钟前
【JavaScript】React 实现 Vue 的 watch 和 computed 详解
javascript·vue.js·react.js
OEC小胖胖6 分钟前
16|总复习:把前 15 章串成一张 React 源码主线地图
前端·react.js·前端框架·react·开源库
董世昌418 分钟前
HTTP协议中,GET和POST有什么区别?分别适用什么场景?
java·开发语言·前端
_OP_CHEN9 分钟前
【前端开发之HTML】(二)HTML 常见标签(上):从入门到实战,搞定网页基础排版!
前端·css·html·前端开发·网页开发·html标签
衫水26 分钟前
Ubuntu 系统部署 Vue/Vite 应用到 Nginx
vue.js·nginx·ubuntu
满栀58526 分钟前
插件轮播图制作
开发语言·前端·javascript·jquery
切糕师学AI31 分钟前
Vue 中的计算属性(computed)
前端·javascript·vue.js
程琬清君34 分钟前
Vue3DraggableResizable可移动范围有问题
前端·javascript·vue.js