element upload 自定义上传 报错Cannot set properties of null (setting ‘status‘)

element upload 自定义上传 报错Cannot set properties of null (setting ‘status’)

问题展示

问题展示

原因分析

自定义上传方式
fileList 显示一切正常,状态也是成功
文件url通过URL.createObjectURL(file.raw) 进行添加
以下为配置代码

<el-upload
  class="upload-demo"
  action=""
  :on-change="uploadImageChange"
  :on-remove="handleRemove"
  :before-remove="beforeRemove"
  multiple
  :limit="1"
  :on-exceed="handleExceed"
  :file-list="fileList"
>
  <el-button size="small" type="primary">点击上传</el-button>
  <div slot="tip" class="el-upload__tip" style="font-size: 11px;">只能上传svg文件,且不超过500kb</div>
</el-upload>

以下为fileList 添加代码

that.fileList = [{ name: new Date().getTime(), url: URL.createObjectURL(res.raw) }]
问题修复

在组件上添加以下代码

:auto-upload="false"

完整代码如下所示

<el-upload
 class="upload-demo"
  action=""
  :on-change="uploadImageChange"
  :on-remove="handleRemove"
  :before-remove="beforeRemove"
  :auto-upload="false"
  multiple
  :limit="1"
  :on-exceed="handleExceed"
  :file-list="fileList"
>
  <el-button size="small" type="primary">点击上传</el-button>
  <div slot="tip" class="el-upload__tip" style="font-size: 11px;">只能上传svg文件,且不超过500kb</div>
</el-upload>

添加后问题即可修复

注意

本文上传方式为自定义上传action 为空,因此需要添加:auto-upload=“false”

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

Nginx初体验

文章目录 定义正向代理 & 反向代理安装与尝试 之前没怎么用过代理服务器Nginx&#xff0c;主要也是因为没有架构知识&#xff0c;根本不会去部署相关的机器。但是最近公司内部在调试的时候&#xff0c;经常用本机去充当Ngnix代理服务器&#xff0c;由于对这块知识掌握得还不…

Linux网络通信

网络模型 七层模型 四层模型 TCP : 面向连接&#xff0c;可靠的&#xff0c;面向字节流&#xff0c;支持点对点通信。 UDP : 无连接&#xff0c;不可靠&#xff0c;面向数据报文&#xff0c;支持一对一&#xff0c;一对多&#xff0c;多对多。通信原理 常用函数 #include <…

深入理解 go reflect - 要不要传指针

在我们看一些使用反射的代码的时候&#xff0c;会发现&#xff0c;reflect.ValueOf 或 reflect.TypeOf 的参数有些地方使用的是指针参数&#xff0c;有些地方又不是指针参数&#xff0c; 但是好像这两者在使用上没什么区别&#xff0c;比如下面这样&#xff1a; var a 1 v1 :…

学习笔记-数据库概念介绍

一.数据库概述 1.数据库: 存储数据的仓库,本质是一个文件系统. 用户可以对数据库中的数据进行 增加,修改,删除以及查询操作 2.特点 可以结构化存储大量的数据可以有效的保持数据的一致性,完整性读写效率高 3.常用数据库 二.数据库分类及其常用 关系型数据库 指的是二维表格…

肯尼斯·里科《C和指针》第6章 指针(5)概念的练习

肯尼斯里科《C和指针》第6章 指针&#xff08;1&#xff09;-CSDN博客 肯尼斯里科《C和指针》第6章 指针&#xff08;2&#xff09;-CSDN博客 肯尼斯里科《C和指针》第6章 指针&#xff08;3&#xff09;-CSDN博客 肯尼斯里科《C和指针》第6章 指针&#xff08;4&#xff09…

领域驱动设计解决汉诺塔问题-文风批评(1)

DDD领域驱动设计批评文集 做强化自测题获得“软件方法建模师”称号 《软件方法》各章合集 以下文章内容纯属虚构&#xff0c;用来批评某些领域驱动设计文风。后续将挑一些近期的文章作为例子来批评。 ********** 领域驱动设计是革命性的创新&#xff0c;是划时代的洞见。领…

DaisyDisk for mac 中文激活版 可视化磁盘清理工具

DaisyDisk 是一款专为 Mac 设计的磁盘空间分析工具。它以直观、图形化的方式展示硬盘使用情况&#xff0c;帮助用户迅速找到占用空间大的文件和文件夹。通过扫描磁盘&#xff0c;DaisyDisk 生成彩色的扇形图表&#xff0c;每个扇区代表一个文件或文件夹&#xff0c;大小直观反映…

构建基于RHEL9系列(CentOS9,AlmaLinux9,RockyLinux9等)的支持63个常见模块的PHP8.1.20的RPM包

本文适用&#xff1a;rhel9系列&#xff0c;或同类系统(CentOS9,AlmaLinux9,RockyLinux9等) 文档形成时期&#xff1a;2023年 因系统版本不同&#xff0c;构建部署应略有差异&#xff0c;但本文未做细分&#xff0c;对稍有经验者应不存在明显障碍。 因软件世界之复杂和个人能力…

Python 两种多值参数

有时可能需要一个函数中处理的参数的个数是不确定的&#xff0c;就需要使用多值参数 参数名前加上*&#xff0c;代表可以接收元组参数名前加上**&#xff0c;代表可以接收字典 代码&#xff1a; def demo(*args, **kwargs):print(args)print(kwargs)demo(1, 2, 3, 4, 5, nam…

采样次数与频率的关系

采样次数&#xff08;Sampling Points&#xff09; 在给定时间内记录信号值的次数。 假设在1秒内对一个连续信号采样10次&#xff0c;这意味着每0.1秒记录一次信号值。 假设在1秒内对一个连续信号采样100次&#xff0c;这意味着每0.01秒记录一次信号值。 频率&#xff08;Fre…

【昕宝爸爸小模块】守护线程、普通线程、两者之间的区别

➡️博客首页 https://blog.csdn.net/Java_Yangxiaoyuan 欢迎优秀的你&#x1f44d;点赞、&#x1f5c2;️收藏、加❤️关注哦。 本文章CSDN首发&#xff0c;欢迎转载&#xff0c;要注明出处哦&#xff01; 先感谢优秀的你能认真的看完本文&…

创新引领游戏产业:武汉灰京文化的成功之路

随着科技的不断发展&#xff0c;游戏产业已经成为全球最具竞争力和创新性的领域之一。在这个激烈的竞技场上&#xff0c;武汉灰京文化凭借其专业化、创新性和诚信的经营理念迅速崭露头角&#xff0c;成功将自身打造成为游戏产业的巨头。 作为游戏产业的佼佼者&#xff0c;武汉…

【极光系列】Windows安装Mysql8.0版本

【极光系列】Windows安装Mysql8.0版本 一.mysql服务端 下载地址&#xff1a;https://dev.mysql.com/downloads/mysql/ 二.解压二进制包 解压到 E:\mysql-8.0.35-winx64目录下&#xff0c;记住你解压后的目录&#xff0c;后续要使用三.创建my.ini文件 tips&#xff1a;mys…

【数据结构和算法】删除链表的中间节点

其他系列文章导航 Java基础合集数据结构与算法合集 设计模式合集 多线程合集 分布式合集 ES合集 文章目录 其他系列文章导航 文章目录 前言 一、题目描述 二、题解 三、代码 四、复杂度分析 前言 这是力扣的1657题&#xff0c;难度为中等&#xff0c;解题方案有很多种&…

unity C#什么是线程锁,以及使用案例

文章目录 原理1. **互斥**&#xff08;Mutual Exclusion&#xff09;:2. **缓存一致性与内存屏障**&#xff1a;3. **操作系统的支持**&#xff1a;4. **编程语言级别的实现**&#xff1a;5. **避免死锁**&#xff1a;图示 实例1实例2 原理 线程锁的原理主要是为了在多线程环境…

FastAdmin西陆教育系统(xiluEdu)开源代码

应用介绍 一款基于FastAdminThinkPHPUniapp开发的西陆教育系统&#xff08;微信小程序、移动端H5、安卓APP、IOS-APP&#xff09;&#xff0c;以下是教育系统所包含的一些功能&#xff1a; 视频课程&#xff1a;教育系统提供在线视频课程&#xff0c;学生可以通过网络观看教师…

双双入选 中科驭数第二代DPU芯片K2和低时延DPU卡荣获2023年北京市新技术新产品新服务认定

北京市新技术新产品&#xff08;服务&#xff09;认定是北京市从重点发展的先导技术、战略性新兴产业和现代服务业领域中&#xff0c;选拔出技术先进、产权明晰、质量可靠、市场前景广阔&#xff0c;且符合构建“高精尖”经济结构要求的产品及服务&#xff0c;具有较高权威性和…

C盘满了,我用什么思路清理?

20240115 上周六同事传了一个很大的虚拟机给我&#xff0c;C盘就红了 虽然是飞秋选错了存储文件的路径&#xff0c;但后来忘了&#xff0c;就开始毫无目的删除文件&#xff0c;过程中会有没有权限删除的&#xff0c;这样还是没有改善。 咨询了公司IT技术人员&#xff0c; 告…

conda环境下No module named ‘pytorch_lightning‘问题解决

1 问题描述 在训练wav2lip模型时&#xff0c;出现如下错误&#xff1a; D:\.conda\wav2lip\python.exe D:/ml/wav2lip384/parallel_syncnet_tanh.py --data_root D:/ml/Wav2Lip/data/25fps_out/ --checkpoint_dir syncnet_checkpoints/ --checkpoint_path Traceback (most re…

Java学习(十七)--IO流

File类 介绍 文件是保存数据的地方&#xff0c;而文件在程序中是以流的形式来操作&#xff1b; java.io.File类是 java.io 包中唯一代表磁盘文件本身的对象&#xff1b; 如果希望在程序中操作文件和目录&#xff0c;则都可以通过 File 类来完成 file能新建、删除、重命名…
最新文章