element-ui中的上传组件el-upload非自动上传监听不到success

news2025/4/22 12:11:22

当设置了:auto-upload="false"

监听不到success回调

要用自定义请求去监听

:http-request="requestUploadFile"

//设置 auto-upload为false,要自定义请求http-request
//:auto-upload="false"
//:http-request="requestUploadFile"

<el-upload
          ref="upload"
          class="upload-demo"
          v-loading="loading"
          action="#"
          :headers="Token"
          :limit="1"
          :multiple='true'
          :auto-upload="false"
          :http-request="requestUploadFile"
          :on-change="handleChange"
          :accept="accept"
          :file-list="fileList"
          :on-preview="handlePictureCardPreview"
          :show-file-list="true"
        >
            <el-button type="success">点击上传</el-button>
        </el-upload>
//自定义请求方法
async requestUploadFile(options) {
      const { action, data, file, filename, headers, onError, onProgress, onSuccess } = options;
      
      // 创建 FormData
      const formData = new FormData();
      formData.append(filename, file);
      
      // 添加额外数据
      if (data) {
        Object.keys(data).forEach(key => {
          formData.append(key, data[key]);
        });
      }
      
      // 使用 axios 或其他 HTTP 库上传
      axios.post(this.BASE_API+this.url, formData, {
        headers: {
          ...headers,
          'Content-Type': 'multipart/form-data'
        },
      }).then(response => {
        // console.log('上传成功---',response)
       if(response.data.code == 0){
          this.$emit('queryHandle')
          this.$message({
              message: response.data.msg,
              type: "success",
          });
       }else{
        this.$message({
          message: response.data.msg,
          type: "error",
        });
       }
      }).catch(error => {
        this.$message({
          message: error,
          type: "error",
        });
      });
    },
  //发送按钮
    submitUpload() {
      this.$refs.upload.submit();
    },
  

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2340088.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Github中项目的公开漏洞合集

前言 最近在搜CVE的时候&#xff0c;意外发现了GitHub Security Advisories。 可能对一些人来说&#xff0c;已经是老东西了。但我还是第一次见到。 觉得挺好用的&#xff0c;就分享出来。 GitHub Security Advisories GitHub Security Advisories 是 GitHub 提供的一项重要…

蚂蚁全媒体总编刘鑫炜再添新职,出任共工新闻社新媒体研究院院长

2025年4月18日&#xff0c;共工新闻社正式宣布聘任蚂蚁全媒体总编刘鑫炜为新媒体研究院院长。此次任命标志着刘鑫炜在新媒体领域的专业能力与行业贡献再次获得权威机构认可。 刘鑫炜深耕新媒体领域多年&#xff0c;曾担任中国新闻传媒集团新媒体研究院院长、蚂蚁全媒体总编等职…

吴恩达强化学习复盘(2)K-Means初始化|K的选择|算法优化

K-Means初始化 K-Means 算法的第一步是随机选择位置作为初始聚类中心&#xff08;new one through newk&#xff09;&#xff0c;但如何进行随机猜测是需要探讨的问题。一般需要多次尝试初始猜测&#xff0c;以期望找到更好的聚类结果。 K 值选择及初始聚类中心选取方法 K 值…

SQL优化案例分享 | PawSQL 近日推出 Lateral Join 重写优化算法

一、Lateral 查询语法介绍 Lateral 查询是SQL中的一种连接方式&#xff0c;它允许FROM子句中的子查询引用同一FROM子句中前面的表的列。虽然这种特性提供了强大的表达能力&#xff0c;但在某些场景下可能导致性能问题。PawSQL优化器近日实现了一种针对特定类型Lateral Join的重…

电子电器架构 ---软件定义汽车的电子/电气(E/E)架构

我是穿拖鞋的汉子,魔都中坚持长期主义的汽车电子工程师。 老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 周末洗了一个澡,换了一身衣服,出了门却不知道去哪儿,不知道去找谁,漫无目的走着,大概这就是成年人最深的孤独吧! 旧人不知我近况,新人不知我过…

ONLYOFFICE协作空间3.1发布:虚拟数据房间中基于角色的表单填写、房间模板、改进访客管理等

全新升级的 ONLYOFFICE 协作空间有着约 40 项新功能和改进&#xff0c;将您的文档协作和管理体验提升到全新高度。阅读本文&#xff0c;了解所有优化功能。 关于 ONLYOFFICE ONLYOFFICE 是一个国际开源项目&#xff0c;专注于高级和安全的文档处理&#xff0c;可提供文本文档、…

Docker如何更换镜像源提高拉取速度

在国内&#xff0c;由于网络政策和限制&#xff0c;直接访问DockerHub速度很慢&#xff0c;尤其是在拉取大型镜像时。为了解决这个问题&#xff0c;常用的方法就是更换镜像源。本文将详细介绍如何更换Docker镜像源&#xff0c;并提供当前可用的镜像源。 换源方法 方法1&#x…

示波器探头状态诊断与维护技术指南

一、探头性能劣化特征分析 信号保真度下降 ・时域表现&#xff1a;上升沿时间偏离标称值15%以上&#xff08;如1ns探头测得≥1.15ns&#xff09; ・频域特性&#xff1a;-3dB带宽衰减超过探头标称值20%基准稳定性异常 ・直流偏置电压漂移量&#xff1e;5mV&#xff08;预热30分…

FreeRTOS互斥信号量解决优先级翻转实战教程

FreeRTOS互斥信号量解决优先级翻转实战教程 大家好&#xff01;今天我们来深入探讨FreeRTOS中的优先级翻转问题&#xff0c;并通过互斥信号量来解决这个问题。上一篇文章我们已经了解了优先级翻转的现象&#xff0c;今天我们将动手实践&#xff0c;通过代码对比来直观感受互斥…

第一篇:从哲学到管理——实践论与矛盾论如何重塑企业思维

引言&#xff1a;当革命哲学照亮现代商业 1937年&#xff0c;毛泽东在战火中写就的《实践论》《矛盾论》&#xff0c;为中国共产党提供了认识世界的方法论。今天&#xff0c;这两部著作正成为企业破解管理困局的“思维操作系统”&#xff1a; 战略模糊&#xff1a;据Gartner统…

14.电容的高频特性在EMC设计中的应用

电容的高频特性在EMC设计中的应用 1. 电容自谐振频率特性对EMC的作用2. 退耦电容的选型3. Y电容选型注意事项4. 储能电容与电压跌落的瞬时中断5. 穿心电容对EMC滤波的作用 1. 电容自谐振频率特性对EMC的作用 电容的高频特性等效模型如下&#xff1a; 其自谐振成因如下&#x…

网络编程4

day4 一、Modbus 1.分类 (1).Modbus RTU: 运行在串口上的协议&#xff0c;采用二进制表现形式以及紧凑型数据结构&#xff0c;通信效率高&#xff0c;应用广泛。(2).Modbus ASCII: 运行在串口上的协议&#xff0c;采用ASCII码传输&#xff0c;并且利用特殊字符作为其字节的开始…

Java 性能优化:如何利用 APM 工具提升系统性能?

Java 性能优化&#xff1a;如何利用 APM 工具提升系统性能&#xff1f; 在当今竞争激烈的软件开发领域&#xff0c;系统性能至关重要。随着应用规模的扩大和用户需求的增加&#xff0c;性能问题逐渐凸显&#xff0c;这不仅影响用户体验&#xff0c;还可能导致业务损失。而 APM…

AI音乐解决方案:1分钟可切换suno、udio、luno、kuka等多种模型,suno风控秒切换 | AI Music API

你有没有觉得&#xff0c;suno风控来了&#xff0c;就要停服了&#xff1f; 你有没有觉得&#xff0c;对接多种音乐模型&#xff0c;让你很疲乏&#xff1f; 你有没有觉得&#xff0c;音乐模型&#xff0c;中文咬字不清楚&#xff0c;让你很苦恼&#xff1f; 别怕&#xff0…

一键升级OpenSSH/OpenSSL修复安全漏洞

在服务器安全运维过程中&#xff0c;我们经常面临这样的问题&#xff1a;收到高危漏洞通报&#xff08;如最近的OpenSSH多个CVE漏洞&#xff09;&#xff0c;但Ubuntu系统无法通过apt直接升级到修复版本。这种情况下&#xff0c;传统方法需要手动编译源码&#xff0c;处理依赖关…

健康养生,开启新生活

在饮食上&#xff0c;应遵循 “均衡搭配、清淡少盐” 的原则。主食不要只吃精米白面&#xff0c;可适当加入燕麦、糙米等全谷物&#xff0c;为身体补充膳食纤维&#xff1b;每天保证一斤蔬菜半斤水果&#xff0c;深色蔬菜如菠菜、西兰花富含维生素与矿物质&#xff0c;水果则选…

VLAN间通讯技术

多臂路由 路由器使用多条物理线路&#xff0c;每条物理线路充当一个 VLAN 的网管 注意&#xff1a;路由器对端的交换机接口&#xff0c;需要设定 Access 类型&#xff0c;因为路由器的物理接口无法处理 VLAN 标签 。 单臂路由 使用 以太网子接口 (sub-interface) 实现。 …

人工智能在慢病管理中的具体应用全集:从技术落地到场景创新

一、AI 赋能慢病管理:技术驱动医疗革新 1.1 核心技术原理解析 在当今数字化时代,人工智能(AI)正以前所未有的态势渗透进医疗领域,尤其是在慢性病管理方面,展现出巨大的潜力和独特优势。其背后依托的机器学习、深度学习、自然语言处理(NLP)以及物联网(IoT)与可穿戴设…

B+树节点与插入操作

B树节点与插入操作 设计B树节点 在设计B树的数据结构时&#xff0c;我们首先需要定义节点的格式&#xff0c;这将帮助我们理解如何进行插入、删除以及分裂和合并操作。以下是对B树节点设计的详细说明。 节点格式概述 所有的B树节点大小相同&#xff0c;这是为了后续使用自由…

线性回归之多项式升维

文章目录 多项式升维简介简单案例实战案例多项式升维优缺点 多项式升维简介 多项式升维&#xff08;Polynomial Expansion&#xff09;是线性回归中一种常用的特征工程方法&#xff0c;它通过将原始特征进行多项式组合来扩展特征空间&#xff0c;从而让线性模型能够拟合非线性关…