当前位置: 首页 > news >正文

el-upload组件,上传文件失败,:on-error方法失效

el-upload组件方法失效

  • 问题
  • 原因
  • 解决

问题

使用el-upload组件上传文件,有这么一个问题上传文件处理报错Excel、Word。org.apache.poi.openxml4j.exceptions.OLE2NotOfficeXmlFileException。

按上述,后端编写完代码,输出正常,但是预期在后端抛出错时前端能够有提示。

就希望能够在前端发起“提交/确定”的方法里面有一个catch怎么的,可以在方法抛出异常/报错时能够给到一个地方写代码,但是项目使用的el-upload默认提交,没有一个类似.catch(() => {})暴露出来可以处理的方法。

好在el-upload官方有一些方法如下:
在这里插入图片描述
但是我在:on-error="handleUploadError"方法中写了处理还是没有生效(后端抛异常,前端给提示)。
![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/651bb8fd11b744ca80296be4d09cfec8.png在这里插入图片描述

原因

项目后端对响应封装处理,http响应码是200,手动将抛异常的响应code置500,作为response返回。
这个时候前端不知道你是抛出异常返回的,而是认为请求时被成功处理的,故在组件el-upload识别不到是上传出错,:on-error的方法也不能执行。

解决

在el-upload中其他的方法手动判断,比如在:on-success="handleFileSuccess"中进行手动判断

if (response.code !== 200) {
this.$message.error(response.msg || '上传失败');
}

注意:
1.项目对于异常/报错等返回消息的code是什么
2.是否属于上述情况在于,浏览器F12检查,这个方法是否http是200,自己手动检查其response中的响应码是否属于200

相关文章:

  • 使用java实现蒙特卡洛模拟风险预测功能
  • 【运维】【期末实训】网站简易搭建模拟
  • 笔记 软件工程复习
  • 详解CNN
  • 【Kafka】消息队列Kafka知识总结
  • Kafka 的容错与持久性:副本复制机制的工作原理与实践
  • 【动作】动作标签分析和导出系统(按照分类)
  • 日语面试AI:如何用AI工具高效备战日语面试?
  • LangChain4j在Java企业应用中的实战指南:构建RAG系统与智能应用
  • 板凳-------Mysql cookbook学习 (十--4)
  • 【学习笔记】虚函数+虚析构函数
  • React【回顾】 深层次面试详解:函数式组件核心原理与高级优化
  • 曼昆《经济学原理》第九版 第十三章生产成本
  • 安装HomeBrew
  • Docker重启流程解析
  • 基于binlog恢复误删除MySQL数据
  • 利用ngx_stream_return_module构建简易 TCP/UDP 响应网关
  • 系统设计 --- MongoDB亿级数据查询优化策略
  • Python 爬虫工具全解析及实战指南
  • 将两个变量a,b的值进行交换,不使用任何中间变量
  • 建设完网站成功后需要注意什么问题/商业软文代写
  • 吉林沈阳网站建设/seo网站设计
  • 烟台网站建设联系电话/免费b2b网站推广渠道
  • 导航网站设计方案/如何推广微信公众号
  • 美康优选网站怎么做的/网页模版
  • 藏文网站怎么做/美区下载的app怎么更新