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',
  })
}
相关推荐
Aerelin6 分钟前
爬虫playwright中的资源监听
前端·爬虫·js·playwright
WordPress学习笔记13 分钟前
专业建外贸网站公司推荐
大数据·前端·人工智能
fruge34 分钟前
前端简历优化:如何突出项目亮点与技术深度(附示例)
前端
华仔啊37 分钟前
Vue3 + Element Plus 动态菜单实现:一套代码完美适配多角色权限系统
前端·vue.js
n***840742 分钟前
Springboot-配置文件中敏感信息的加密:三种加密保护方法比较
android·前端·后端
姜太公钓鲸2331 小时前
Bootstrap是什么?作用是什么?使用场景是什么?如何使用?
前端·bootstrap·html
Aerelin1 小时前
爬虫playwright中的等待机制
前端·爬虫·python
慧慧吖@1 小时前
关于在本地去模拟生产环境检测页面内容注意事项
前端·javascript·vue.js
码农很忙1 小时前
用SpreadJS实现分权限管理:前端技术栈的精准控制实践
前端
黄团团1 小时前
Vue2整合Electron开发桌面级应用以及打包发布(提供Gitee源码)
前端·javascript·vue.js·elementui·electron