vue-element-ui upload组件调用两次接口
在使用upload中,默认是自动上传,会发现会调用两次接口,一次是Request Method: OPTIONS且不带任何参数(群里大佬说是跨域 预检测),一次是Request Method: POST请求且带上我们设定的参数
如果程序仅需上传单张图片,同时执行两次肯定是不好的,其中一次还是无效的,所以,我绑定了一个:on-change方法,手动上传图片
代码如下:
<el-upload
class="inline-block"
action=""
:auto-upload="false"
:show-file-list="false"
:before-upload="beforeUpload"
:on-change="uploadChange">
<el-button type="primary">上传服务费加密文件</el-button>
<div slot="tip" class="el-upload__tip">只能上传excel文件,且不超过1M</div>
</el-upload>
      uploadChange(file, fileList) {
        let formData = new FormData()
        formData.append('file', file.raw)
        pub.post(this.uploadApi, formData).then((res) => {
          if (res === 'success') {
            this.$message.success('上传成功')
          } else {
            this.$message.error('上传失败')
          }
        })
      },
解决了单张图片的上传问题
vue-element-ui upload组件调用两次接口的更多相关文章
- [转]vue Element UI走马灯组件重写
		https://blog.csdn.net/u013750989/article/details/82885482 1.element ui走马灯组件 -- carousel分析一波源代码:carou ... 
- vue+element UI以组件递归方式实现多级导航菜单
		介绍 这是一个是基于element-UI的导航菜单组件基础上,进行了二次封装的菜单组件,该组件以组件递归的方式,实现了可根据从后端接收到的json菜单数据,动态渲染多级菜单的功能. 使用方法 由于该组 ... 
- vue+element ui table组件封装,使用render渲染
		后台管理经常会用到表格,一开始封装了一个常用的功能性表格,点击这里: 后来由于需求增加,在表格中还会用到switch,select,input等多种组件,每次都要在html中增加<el-tabl ... 
- vue+element ui 的上传文件使用组件
		前言:工作中用到 vue+element ui 的前端框架,使用到上传文件,则想着封装为组件,达到复用,可扩展.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9 ... 
- vue+element ui 的表格列使用组件
		前言:工作中用到 vue+element ui 的前端框架,有这个场景:很多表格的列有许多一样的,所以考虑将列封装为组件.转载请注明出处:https://www.cnblogs.com/yuxiaol ... 
- vue+element ui中select组件选择失效问题原因与解决方法
		codejing 2020-07-10 09:13:31 652 收藏 分类专栏: Web Vue Element UI 版权 .当表单form赋完值后,如果后续又对form中某一属性值进行操作如 ... 
- Vue+element ui table 导出到excel
		需求: Vue+element UI table下的根据搜索条件导出当前所有数据 参考: https://blog.csdn.net/u010427666/article/details/792081 ... 
- 使用element的upload组件实现一个完整的文件上传功能(下)
		本篇文章是<使用element的upload组件实现一个完整的文件上传功能(上)>的续篇. 话不多说,接着上一篇直接开始 一.功能完善—保存表格中每一列的文件列表状态 1.思路 保存表格中 ... 
- vue +  element ui 表格自定义表头,提供线上demo
		前言:工作中用到 vue+element ui 的前端框架,需要使用自定义表头,需要使用 re.转载请注明出处:https://www.cnblogs.com/yuxiaole/p/9710826.h ... 
随机推荐
- git多人参与的项目 -> 分支代码如何合并到主干
			个人理解:合并分支时候就是当前分支,与别的分支先合并一遍,然后解决分支中存在的所有冲突,之后将本地分支代码提交到git远程仓库,之后切换主干分支 ,将主干分支与分支内容合并,解决冲突, 在提交主干分支 ... 
- pom.xml报Plugin execution not covered by lifecycle configuration错误
			环境 eclipse 4.3.0 maven 3.0.4 m2e 1.4.0 出现场景 以前的老项目,在我的环境(我的环境较新)下,别人老环境不报错. 错误示 ... 
- linux设置MySQL开机自动启动
			step1: 通过chkconfig --list命令查看mysqld是否在列表中: step2: 如果列表中没有mysqld这个,需要先用这个命令添加:chkconfig --add mysqld ... 
- docker —宝塔面板
			下载个单独的系统镜像 [root@git opt]# docker images REPOSITORY TAG IMAGE ID CREATED SIZE docker.io/nginx-tomcat ... 
- [Java]算术表达式求值之一(中序表达式转后序表达式方案)
			第二版请见:https://www.cnblogs.com/xiandedanteng/p/11451359.html 入口类,这个类的主要用途是粗筛用户输入的算术表达式: package com.h ... 
- java的引用传递
			public class T{ static class Node{ int value; Node left = null; Node right = null; public Node(int v ... 
- Python学习笔记:MySQL数据库连接和使用
			一.安装pymysql插件 直接在pycharm中安装即可. 二.使用 1.数据库插入操作 insert 注意: insert语句需要提交,使用commit() 如果报错,需要回滚.使用rollbac ... 
- 连接Xshell
			连xshell之前先进入[root@localhost zxj]# vim /etc/ssh/sshd_config, 将115行删除注释改为UseDNS no, 保存重启sshd(xshell)的 ... 
- python__005
			一.字符串格式化 #字符串的拼接#msg='i am a best boy'+'非常帅'print(msg)name=input('name:')hobby=input(('hobby:'))age= ... 
- LeetCode.941-有效山形数组(Valid Mountain Array)
			这是悦乐书的第360次更新,第387篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第222题(顺位题号是941).给定一个整数数组A,当且仅当它是一个有效的山形数组时返回 ... 
