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

在vue中实现下载文件功能

实际操作为,在表格中

我们可以获取到文件的id,通过插槽就可以实现

<template #default="scope"><el-button type="text" @click="handleDown(scope.row)"><span>下载</span></el-button>
</template>

 handleDown(val){const a = document.createElement("a");const event = new MouseEvent("click");a.download = val.attachmentName;a.href = 下载文件的基本url + val.documentId;a.dispatchEvent(event);},

解析上段代码

  1. const a = document.createElement("a");:创建了一个新的 <a> 元素,该元素用于生成下载链接。
  2. const event = new MouseEvent("click");:创建了一个新的 MouseEvent 对象,该对象用于模拟点击事件。
  3. a.download = val.attachmentName;:将下载链接的文件名设置为 val.attachmentName
  4. a.href = 下载文件的基本Url + val.documentId;+后面为参数,也就是文件的id
  5. a.dispatchEvent(event);: dispatch 事件,以模拟点击下载链接,从而触发浏览器的下载行为。

相关文章:

在vue中实现下载文件功能

实际操作为&#xff0c;在表格中 我们可以获取到文件的id&#xff0c;通过插槽就可以实现 <template #default"scope"><el-button type"text" click"handleDown(scope.row)"><span>下载</span></el-button> </…...

文件中海量数据的排序

文件中海量数据的排序 题目&#xff1a; 跟之前堆排序可以解决TopK问题一样&#xff0c;我们来看看归并排序会用来解决什么问题&#xff1f; 思路&#xff1a; 我们说归并排序是外排序。其实就是将数据分成一个个小段&#xff0c;在内存中进行排序&#xff0c;再拿出内存&am…...

java项目之视频网站系统源码(springboot+vue+mysql)

风定落花生&#xff0c;歌声逐流水&#xff0c;大家好我是风歌&#xff0c;混迹在java圈的辛苦码农。今天要和大家聊的是一款基于springboot的视频网站系统。项目源码以及部署相关请联系风歌&#xff0c;文末附上联系信息 。 项目简介&#xff1a; 视频网站系统的主要使用者管…...

262 基于matlab的一级倒立摆仿真

基于matlab的一级倒立摆仿真&#xff0c;在对一级倒立摆进行数学建模的基础上&#xff0c;对模型进行线性化&#xff0c;得到其状态空间模型&#xff0c;利用二次型最优控制方法得出控制率。输出角度和位置优化曲线。程序已调通&#xff0c;可直接运行。 262 一级倒立摆仿真 状…...

智能无网远控再升级 向日葵Q2Pro升级版发布

无网或者内网设备也想要进行远程控制&#xff0c;是不是听上去有些天方夜谭了&#xff1f;其实这类特种设备的远程控制需求是非常强的&#xff0c;比如医疗/工控设备的远程运维、使用指导教学等等。 实际上&#xff0c;只要这类设备有屏幕&#xff0c;支持可视化的桌面操作&am…...

2024电工杯A题详细思路代码分析数学建模:园区微电网风光储协调优化配置

题目分析&#xff1a;园区微电网风光储协调优化配置 我们会先给出三个问题总体的分析&#xff0c;最后会详细分析问题一的建模和详细内容。 背景&#xff1a; 园区微电网由风光发电和主电网联合为负荷供电&#xff0c;为了尽量提高风光电量的负荷占比&#xff0c;需配置较高比…...

Docker搭建mysql性能测试环境

OpenEuler使用Docker搭建mysql性能测试环境 一、安装Docker二、docker安装mysql三、测试mysql连接 一、安装Docker 建立源文件vim /etc/yum.repos.d/docker-ce.repo增加内容[docker-ce-stable] nameDocker CE Stable - $basearch baseurlhttps://repo.huaweicloud.com/docker…...

关于开启直连v2rayn代理Fiddler Charles bp抓包失败问题

Fiddler 使用插件&#xff1a;proxy switchyomega 配置代理8888端口为fiddler && charles的监听端口 此时fiddler提示代理已更改点击变更捕获&#xff0c;这时不需要进行点击只需要开启上述插件即可抓到包并且国外代理&#xff0c;如果点击的话回自动更新为原来的ip 即…...

Python 爬虫编写入门

一、爬虫概述 网络爬虫&#xff08;Web Crawler&#xff09;或称为网络蜘蛛&#xff08;Web Spider&#xff09;&#xff0c;是一种按照一定规则&#xff0c;自动抓取互联网信息的程序或者脚本。它们可以自动化地浏览网络中的信息&#xff0c;通过解析网页内容&#xff0c;提取…...

Linux网络编程(socket)

1. 概念 局域网和广域网 局域网&#xff1a;局域网将一定区域内的各种计算机、外部设备和数据库连接起来形成计算机通信的私有网络。广域网&#xff1a;又称广域网、外网、公网。是连接不同地区局域网或城域网计算机通信的远程公共网络。 IP&#xff08;Internet Protocol&a…...

以太坊(3)——智能合约

智能合约 首先明确一下几个说法&#xff08;说法不严谨&#xff0c;为了介绍清晰才说的&#xff09;&#xff1a; 全节点矿工 节点账户 智能合约是基于Solidity语言编写的 学习Solidity语言可以到WFT学院官网&#xff08;Hello from WTF Academy | WTF Academy&#xff09;…...

【Python设计模式03】简单工厂模式

简单工厂模式&#xff08;Simple Factory Pattern&#xff09;是一种创建型设计模式&#xff0c;它通过专门定义一个工厂类来负责创建其他类的实例&#xff0c;而不是在客户端代码中直接实例化对象。这样可以将对象创建的过程与使用对象的过程分离&#xff0c;提高代码的可维护…...

java中的Collections类+可变参数

一、概述 Collections类是集合类的工具类&#xff0c;与数组的工具类Arrays类似 二、可变参数(变&#xff1a;数量) 格式&#xff1a;参数类型名...参数&#xff0c;可变参数就是一个数组 注意&#xff1a;可变参数必须放在参数列表的最后并且一个参数列表只能有一个可变参…...

SpringBoot集成腾讯云敏感词校验API流程

1.pom.xml中引入腾讯云jar配置信息 <dependency><groupId>com.tencentcloudapi</groupId><artifactId>tencentcloud-sdk-java</artifactId><version>4.0.11</version> </dependency> 2.application.yaml中添加配置 tencent…...

android 避免混淆类名和方法名,但是方法内容需要被混淆

要避免在使用 ProGuard 或 R8 进行代码混淆时混淆特定类名和方法名的同时让方法内容被混淆&#xff0c;你需要在 ProGuard 配置文件中使用 -keepclassmembers 或 -keep 规则。这些规则允许你指定保留类名和方法名的同时允许方法内部代码被混淆以减小体积和提高安全性。 以下是…...

通过ELRepo修改CentOS 7内核版本的详细步骤

简介&#xff1a; 在Linux系统中&#xff0c;内核版本决定了硬件支持和系统性能。有时&#xff0c;为了获得更好的性能或新特性&#xff0c;我们需要升级或更换内核。本文将详细说明如何在CentOS 7系统上通过ELRepo仓库安装更新的内核版本。 环境准备&#xff1a; CentOS 7系…...

C++开源库glog使用封装--自定义日志输出格式,设置日志保留时间

glog下载和编译 glog开源地址 https://github.com/google/glog glog静态库编译 cd /home/wangz/3rdParty/hldglog/glogmkdir out mkdir build && cd buildcmake .. -DCMAKE_INSTALL_PREFIX../out -DCMAKE_BUILD_TYPERelease -DBUILD_SHARED_LIBSOFF本文选择的glo…...

linux rc.local不生效

1. 权限问题直接 chmod 755 /etc/rc.d/rc.local 即可 2.本次发现问题 环境复杂造成&#xff0c;系统中有多个版本的JDK&#xff0c;导致tomcat无法启动 systemctl status rc-local.service ● rc-local.service - /etc/rc.d/rc.local CompatibilityLoaded: loaded (/usr/lib…...

ROS2入门21讲__第07讲__节点:机器人的工作细胞

目录 前言 通信模型 案例一&#xff1a;Hello World节点&#xff08;面向过程&#xff09; 运行效果 代码解析 创建节点流程 案例二&#xff1a;Hello World节点&#xff08;面向对象&#xff09; 运行效果 代码解析 创建节点流程 案例三&#xff1a;物体识别节点 …...

k8s node NotReady后会发生什么?

K8s 是一种强大的容器编排和管理平台&#xff0c;能够高效地调度、管理和监控容器化应用程序&#xff1b;其本身使用声明式语义管理着集群内所有资源模型、应用程序、存储、网络等多种资源&#xff0c;Node 本身又属于 K8s 计算资源&#xff0c;上面承载运行着各种类型的应用程…...

Python爬虫实战:研究MechanicalSoup库相关技术

一、MechanicalSoup 库概述 1.1 库简介 MechanicalSoup 是一个 Python 库,专为自动化交互网站而设计。它结合了 requests 的 HTTP 请求能力和 BeautifulSoup 的 HTML 解析能力,提供了直观的 API,让我们可以像人类用户一样浏览网页、填写表单和提交请求。 1.2 主要功能特点…...

Vue记事本应用实现教程

文章目录 1. 项目介绍2. 开发环境准备3. 设计应用界面4. 创建Vue实例和数据模型5. 实现记事本功能5.1 添加新记事项5.2 删除记事项5.3 清空所有记事 6. 添加样式7. 功能扩展&#xff1a;显示创建时间8. 功能扩展&#xff1a;记事项搜索9. 完整代码10. Vue知识点解析10.1 数据绑…...

系统设计 --- MongoDB亿级数据查询优化策略

系统设计 --- MongoDB亿级数据查询分表策略 背景Solution --- 分表 背景 使用audit log实现Audi Trail功能 Audit Trail范围: 六个月数据量: 每秒5-7条audi log&#xff0c;共计7千万 – 1亿条数据需要实现全文检索按照时间倒序因为license问题&#xff0c;不能使用ELK只能使用…...

蓝牙 BLE 扫描面试题大全(2):进阶面试题与实战演练

前文覆盖了 BLE 扫描的基础概念与经典问题蓝牙 BLE 扫描面试题大全(1)&#xff1a;从基础到实战的深度解析-CSDN博客&#xff0c;但实际面试中&#xff0c;企业更关注候选人对复杂场景的应对能力&#xff08;如多设备并发扫描、低功耗与高发现率的平衡&#xff09;和前沿技术的…...

Java - Mysql数据类型对应

Mysql数据类型java数据类型备注整型INT/INTEGERint / java.lang.Integer–BIGINTlong/java.lang.Long–––浮点型FLOATfloat/java.lang.FloatDOUBLEdouble/java.lang.Double–DECIMAL/NUMERICjava.math.BigDecimal字符串型CHARjava.lang.String固定长度字符串VARCHARjava.lang…...

Vue2 第一节_Vue2上手_插值表达式{{}}_访问数据和修改数据_Vue开发者工具

文章目录 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染2. 插值表达式{{}}3. 访问数据和修改数据4. vue响应式5. Vue开发者工具--方便调试 1.Vue2上手-如何创建一个Vue实例,进行初始化渲染 准备容器引包创建Vue实例 new Vue()指定配置项 ->渲染数据 准备一个容器,例如: …...

江苏艾立泰跨国资源接力:废料变黄金的绿色供应链革命

在华东塑料包装行业面临限塑令深度调整的背景下&#xff0c;江苏艾立泰以一场跨国资源接力的创新实践&#xff0c;重新定义了绿色供应链的边界。 跨国回收网络&#xff1a;废料变黄金的全球棋局 艾立泰在欧洲、东南亚建立再生塑料回收点&#xff0c;将海外废弃包装箱通过标准…...

【论文笔记】若干矿井粉尘检测算法概述

总的来说&#xff0c;传统机器学习、传统机器学习与深度学习的结合、LSTM等算法所需要的数据集来源于矿井传感器测量的粉尘浓度&#xff0c;通过建立回归模型来预测未来矿井的粉尘浓度。传统机器学习算法性能易受数据中极端值的影响。YOLO等计算机视觉算法所需要的数据集来源于…...

【Web 进阶篇】优雅的接口设计:统一响应、全局异常处理与参数校验

系列回顾&#xff1a; 在上一篇中&#xff0c;我们成功地为应用集成了数据库&#xff0c;并使用 Spring Data JPA 实现了基本的 CRUD API。我们的应用现在能“记忆”数据了&#xff01;但是&#xff0c;如果你仔细审视那些 API&#xff0c;会发现它们还很“粗糙”&#xff1a;有…...

精益数据分析(97/126):邮件营销与用户参与度的关键指标优化指南

精益数据分析&#xff08;97/126&#xff09;&#xff1a;邮件营销与用户参与度的关键指标优化指南 在数字化营销时代&#xff0c;邮件列表效度、用户参与度和网站性能等指标往往决定着创业公司的增长成败。今天&#xff0c;我们将深入解析邮件打开率、网站可用性、页面参与时…...