问题解决:使用el-upload组件获取File文件,不需要文件上传,action为空会请求本地路径报404

可以自定义上传方法、覆盖默认的上传行为
主要是这个属性 :http-request="uploadFn"

<template><span><el-uploadaction="#":on-preview="handlePreview":on-remove="handleRemove":before-remove="beforeRemove":on-success="handleSuccess":limit="limit":http-request="uploadFn":on-exceed="handleExceed":file-list="fileList":on-change="hanldeChange":accept="accept"><el-button size="small" type="primary">点击上传</el-button><div slot="tip" class="el-upload__tip">{{ tipText }}</div></el-upload></span>
</template><script>export default {props: {fileList: {type: Array,default: () => {}},limit: {type: Number,default: 1},tipText: {type: String,default: '请上传文件'},accept: {type: String,default: ''}},data() {return {// fileList: []};},methods: {uploadFn() {},hanldeChange(file) {//新增筛选代码this.fileList.push(file);if (file.status !== 'ready') return;this.$emit('fileSelect', file);},handleSuccess(file) {this.$emit('success', file);},handleRemove(file, fileList) {this.$emit('remove', fileList)},handlePreview(file) {console.log(file);},handleExceed(files, fileList) {this.$message.warning(`当前限制最多可选择 ${this.limit} 个文件`);},beforeRemove(file, fileList) {return this.$confirm(`确定移除 ${ file.name }`);}}
};
</script><style lang="scss" scoped></style>

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

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

相关文章

WorkPlus AI智能客服解决方案,提升企业服务质量

在当今竞争激烈的商业环境中&#xff0c;提供卓越的客户服务成为企业赢得市场竞争的关键。而AI智能客服技术的不断发展&#xff0c;则成为了提高服务效率和满意度的利器。作为一款领先的AI助理解决方案&#xff0c;WorkPlus AI助理以其出色的性能和智能化的功能&#xff0c;助力…

代码随想录算法训练营打卡day1 |704. 二分查找,27. 移除元素

一、LeetCode 704 二分查找 题目链接&#xff1a;704.二分查找 解法一&#xff1a;左闭右闭 class Solution {public int search(int[] nums, int target) {int left 0, right nums.length-1;while(left < right){ //边界处理&#xff0c;左闭右闭int mid left (right-l…

使用bat批量修改文件名

批处理脚本的目的是将指定文件夹中的所有 .mp3 文件的文件名中的数字部分补零成四位&#xff0c;并将文件重命名为新的文件名。以下是脚本的详细解释&#xff1a; echo off: 这个命令用于关闭命令回显&#xff0c;即在脚本运行时不在命令提示符窗口上显示执行的命令。 setloca…

c++入门学习(十八)赋值运算符

简单赋值运算符&#xff08;&#xff09;&#xff1a; 最基本的赋值运算符是“”。它表示将右侧的值赋给左侧的变量。例如&#xff0c;x 5意味着将值5赋给变量x。 增量赋值运算符&#xff1a; 这是一组在赋值的同时对变量进行递增操作的运算符。常见的有、-、*、/等。例如&…

THM学习笔记——网络工具

ping 当我们想要测试是否可以连接到远程资源时&#xff0c;会使用 ping 命令。 ping 的基本语法&#xff1a; ping <target>。 测试是否可以与百度建立网络连接&#xff1a; traceroute 互联网由许多个不同的服务器和端点组成&#xff0c;它们都相互联网。这意味着&a…

C++(1) 命名空间

文章目录 C1. C 概述2.C 相对于 C 语言的增强2.1C 第一行代码2.2 C 补充 bool 类型2.3 作用域运算符2.4 命名空间 namespace2.4.1 命名空间基本内容和开放性2.4.2 多个命名空间操作2.4.3 命名空间函数定义和实现分离2.4.4 匿名命名空间2.4.5 命名空间别名 C 1. C 概述 C 之父…

写立扣mysql题目收获

练习大纲&#xff1a; 立扣上的sql语句题 学习中的易错点和有趣的题目 总结了下常用的关键词和技巧 SELECT: 用于选择要检索的列。FROM: 用于指定要查询的表。WHERE: 用于过滤行&#xff0c;只返回满足条件的行。GROUP BY: 用于将结果集按一列或多列分组。HAVING: 与GROUP …

《剑指 Offer》专项突破版 - 面试题 29 : 排序的循环链表(C++ 实现)

题目链接&#xff1a;LCR 029. 循环有序列表的插入 - 力扣&#xff08;LeetCode&#xff09; 题目&#xff1a; 在一个循环链表中节点的值非递减排序&#xff0c;请设计一个算法在该循环链表中插入节点&#xff0c;并保证插入节点之后的循环链表仍然是排序的。 分析&#xf…

Java集合(List集合)

什么是集合&#xff1f; 什么是集合&#xff1f;集合就是“由若干个确定的元素所构成的整体”&#xff0c;在程序中&#xff0c;一般代表保存 若干个元素&#xff08;数据&#xff09;的某种容器类。 在Java中&#xff0c;如果一个Java对象可以在内部持有&#xff08;保存&…

Windows无法访问github解决方案

方案一 步骤1&#xff1a; 进入 C:\Windows\System32\drivers\etc 路径下 步骤2&#xff1a; 复制 hosts文件到桌面 步骤3&#xff1a; 在复制好的文件最后加上 140.82.114.4 github.com 199.232.69.194 github.global.ssl.fastly.net步骤4&#xff1a; 将修改好的文件替换…

2d关键点可视化 coco转h36m人体关键点

目录 coco转h36m人体关键点 opencv 2d关键点可视化 coco转h36m人体关键点 mhformer中有 def h36m_coco_format(keypoints, scores):assert len(keypoints.shape) 4 and len(scores.shape) 3h36m_kpts []h36m_scores []valid_frames []for i in range(keypoints.shape[…

Soul CEO张璐团队布局AIGC领域,打造数智化社交新体验

作为互联网社交领域的领军企业,Soul App近日再次受到广泛关注,因其在生成式人工智能(AIGC)领域的前沿布局和创新。随着数据积累、算力提升和算法不断迭代,AIGC技术正逐渐成为推动产业创新的重要工具之一。2023年被誉为AIGC元年,而Soul App在CEO张璐的带领下,在这个领域的不懈努…

计算CNN卷积层和全连接层的参数量

计算CNN卷积层和全连接层的参数量 先前阅读 CNN ExplainerA Comprehensive Guide to Convolutional Neural Networks — the ELI5 way 本文主旨意在搞明白2个问题&#xff1a; 第一个问题 一个卷积操作&#xff0c;他的参数&#xff0c;也就是我们要训练的参数&#xff0c;也…

快速添加Android seLinux权限

selinux 权限问题中90%的场景都是在补足缺少的权限&#xff0c;下面的通用方法主要用来解决我们在日志中获取到 avc denied 的问题&#xff1a; 首先获取avc的打印信息&#xff0c;可以通过 logcat | grep avc 获取&#xff0c;假设有如下日志&#xff1a; type1400 audit(0.…

常见逻辑漏洞

挖掘重点&#xff1a; 业务流程和HTTP/HTTPS请求篡改 支付漏洞和越权漏洞是金融业务中常见的 支付漏洞 (1) 密码重置 验证码直接在HTTP响应中返回&#xff1b; 验证码未绑定用户&#xff0c;没和手机号和邮箱号做匹配验证&#xff1b; 未校验用户字段值&#xff0c;改自…

Navigation 2 学习01 介绍及安装及运行示例

Navigation 2 是什么 Nav2 是 ROS 导航 的综合控制服务&#xff0c;类似人类的小脑控制人类的行走及身体平衡&#xff0c;Nav2 针对移动和地面机器人提供支持的自动驾驶车辆的相同类型的技术&#xff0c;经过优化和改造。该项目旨在找到一种安全的方法&#xff0c;使移动机器人…

nginx离线部署-aarch64架构

nginx离线部署-aarch64架构 服务器环境: 架构&#xff1a;aarch64&#xff0c; 系统&#xff1a;Red Hat &#xff08;CentOS 7&#xff09; nginx 1.24 需要准备这些&#xff1a; 可以先尝试安装 Nginx 安装NGINX 内网是没有网络的需要使用 RPM 包安装 gcc&#xff0c; g…

USART通讯

提示&#xff1a;文章 文章目录 前言一、背景二、 2.1 2.2 总结 前言 前期疑问&#xff1a; 1、一开始没有搞明白到底是USART还是UART。 2、其中还涉及到一个同步的概念。同步就是是否有时钟线同步。USART是串口同步异步发送接收器。USART没有时钟线是怎么实现同步的。 3、…

服务器上面安装nodejs react

1、nvm管理nodejs 2、修改端口 /node_modules/react-scripts/scripts/start.js // 这是start.js部分源码 const DEFAULT_PORT parseInt(process.env.PORT, 10) || 3000; const HOST process.env.HOST || 0.0.0.0;// 将3000修改自己需要的端口号 const DEFAULT_PORT parseIn…

KMP字符串匹配算法

介绍&#xff1a; KMP算法是一种改进的字符串匹配算法&#xff0c;由D.E.Knuth&#xff0c;J.H.Morris和V.R.Pratt提出的&#xff0c;因此人们称它为克努特—莫里斯—普拉特操作&#xff08;简称KMP算法&#xff09;。KMP算法的核心是利用匹配失败后的信息&#xff0c;尽量减少…