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

vue中复制内容

vue中复制内容

  • vue2+vue-clipboard2
    • 依赖项
    • 在main.js引入
    • 使用
  • vue3+vue-clipboard3
    • 依赖项
    • 引入
    • 使用

更新于:2023-02-15

vue2+vue-clipboard2

依赖项

“vue”: “^2.6.11”
“vue-clipboard2”: “^0.3.1”

在main.js引入

import VueClipboard from 'vue-clipboard2'
Vue.use(VueClipboard)

使用

<button v-clipboard:copy="copyValue" v-clipboard:success="onCopy" v-clipboard:error="onError">
</button>
// 复制成功
onCopy(e) {this.$message.success("复制成功!");
},
// 复制失败
onError(e) {this.$message.error("复制失败!");
},

vue3+vue-clipboard3

依赖项

“vue”: “^3.2.45”
“vue-clipboard3”: “^2.0.0”

引入

import useClipboard from 'vue-clipboard3'

使用

<button @click="toCopy()">copy</button>
const toCopy = async () => {try {await toClipboard("Any text you like");console.log("Copied to clipboard");} catch (e) {console.error(e);}
};

相关文章:

vue中复制内容

vue中复制内容vue2vue-clipboard2依赖项在main.js引入使用vue3vue-clipboard3依赖项引入使用更新于&#xff1a;2023-02-15vue2vue-clipboard2 依赖项 “vue”: “^2.6.11” “vue-clipboard2”: “^0.3.1” 在main.js引入 import VueClipboard from vue-clipboard2 Vue.us…...

MySQL CAST()函数用法

一、语法 expr&#xff1a;源数据&#xff0c;如字符串’China’。type&#xff1a;目标数据类型&#xff0c;例如CHAR。 cast(expr AS type)二、命令说明 将任何类型的值转换为具有指定类型的值。 CAST()函数通常用于返回具有指定类型的值&#xff0c;以便在WHERE&#xff…...

【测试工程师面试】详细记录 自己的一次面试

【测试工程师面试】详细记录 自己的一次面试 目录&#xff1a;导读 Linux基础 Oracle基础 编程基础 测试的基础 面试的问题 扯闲话部分&#xff1a; 10点刚到&#xff0c;先进行笔试&#xff0c;笔试的题目很基础&#xff0c;涉及到linux&#xff0c;涉及到oracle数据库…...

Elasticsearch 安装(二)

目录前言一、Linux 安装1、下载安装包⑴、选择需要的安装包⑵、下载解压到安装目录2、查看解压后目录结构3、启动 Elasticsearch⑴、正常启动流程⑵、启动过程遇到的问题①、启动报错②、创建运行 Elasticsearch 的用户&#xff0c;启动成功&#xff0c;但无法访问③、停止Elas…...

Java基础:异常与错误(ExceptionError)

1 缘起 某天上网冲浪时&#xff0c;偶然看到一个问题&#xff0c;说Java的Error和Exception有什么区别&#xff1f; 一句话&#xff1a;不知道。并不能很清晰地描述出个中区别。 当然&#xff0c;曾经也看过Throwable相关的知识&#xff0c;但是&#xff0c;并没有通过源码及注…...

VAmPI:一个包含了OWASP Top10漏洞的REST API安全学习平台

关于VAmPI VAmPI是一个包含了OWASP Top10漏洞的REST API安全学习平台&#xff0c;该平台基于Flask开发&#xff0c;该工具的主要目的是通过一个易受攻击的API来评估针对API安全检测工具的有效性&#xff0c;并帮助广大研究人员学习和了解API安全。 功能介绍 1、基于OWASP Top…...

springboot(6)之前端传递参数的方式 普通 集合 数组

实体类传递 首先我们在后端定义一个实体类&#xff0c;通过lombok插件重写 有参 无参 get set toString 方法, 然后前端发送数据&#xff0c;后端就会自动收到&#xff0c;然后属性填写 后端代码如下 AllArgsConstructor Data NoArgsConstructor public class role …...

redis分布式锁的演变过程

提示:文章写完后,目录可以自动生成,如何生成可参考右边的帮助文档 文章目录 一、直接添加Redis缓存二、使用setnx执行抢锁过程三、setnx获取锁+设置过期时间四、引入UUID解决误删锁问题五、引入Lua脚本来做删除六、对递归部分优化进行自旋七、添加自旋次数八、改为重入锁,使…...

leaflet 修改popup的样式,个性化弹窗(069)

第069个 点击查看专栏目录 本示例的目的是介绍演示如何在vue+leaflet中修改popup组件的样式,个性化弹窗。主要方法是更改css, 中增加custom-popup类名,style的样式要做穿透处理 >>>.具体方法请参考源代码。 直接复制下面的 vue+leaflet源代码,操作2分钟即可运行实…...

注解ConfigurationProperties、EnableConfigurationProperties的用法

1 ConfigurationProperties ConfigurationProperties主要作用就是将prefix属性指定的前缀配置项的值绑定到这个JavaBean上 &#xff0c;通过指定的前缀&#xff0c;来绑定配置文件中的配置。这样的好处是将配置数据与JOPO进行转换&#xff0c;能够管理一个类别的所有配置信息&…...

自适应布局之淘宝无限适配+rem+微信rpx自适应

一、自适应布局 所谓前端适配&#xff0c;就是为了让移动设计稿在大部分的移动设备上看起来有一致的展示效果&#xff0c;目前比较流行的方法有两种。一种是强制meta viewport宽度为设计稿宽度&#xff0c;一种是使用rem自适应布局的flexible.js。 二、当前流行的移动端自适应…...

esxi不能识别不兼容网卡解决方案

相信很多网友在安装测试VMWARE Esxi 6.0的时候&#xff0c;总会遇到无法兼容网卡的情况&#xff0c;本人也是遇到了再组装的台式机上测试ESXI 6.0的时候&#xff0c;无法识别REALTEK RTL 8111E的情况。 找了很多网友提供的博客&#xff0c;方法是正确的&#xff0c;但是不够严…...

Sizeof与Strlen的区别与联系

16年写了很多 C 与 C 相关的文章&#xff0c;但是后面从事了 Android 开发&#xff0c;就全部删掉了&#xff0c;无意中发现了这篇由还存在草稿箱&#xff0c;索性就找回来吧&#xff0c;也是追忆当年学习的青葱岁月 Sizeof与Strlen的区别与联系 一、sizeof sizeof(…)是运算…...

力扣(LeetCode)413. 等差数列划分(2023.02.15)

如果一个数列 至少有三个元素 &#xff0c;并且任意两个相邻元素之差相同&#xff0c;则称该数列为等差数列。 例如&#xff0c;[1,3,5,7,9]、[7,7,7,7] 和 [3,-1,-5,-9] 都是等差数列。 给你一个整数数组 nums &#xff0c;返回数组 nums 中所有为等差数组的 子数组 个数。 …...

蓝桥杯刷题——基础篇(一)

这部分题目&#xff0c;主要面向有志参加ACM与蓝桥杯竞赛的同学而准备的&#xff0c;蓝桥杯与ACM考察内容甚至评测标准基本都一样&#xff0c;因此本训练计划提供完整的刷题顺序&#xff0c;循序渐进&#xff0c;提高代码量&#xff0c;巩固基础。因竞赛支持C语言、C、Java甚至…...

Java基础知识快速盘点(三)

一&#xff0c;构造器 创建一个类的方法时会调用该类的构造器 构造器&#xff0c;也叫构造方法 构造器是属于类的&#xff0c;对象不可调用 构造方法没有返回值类型 构造方法一般用public修饰&#xff0c;也可用private修饰&#xff0c;例如 public class Test {private T…...

vscode编程小插件之Doxygen和Better Align

一、插件Doxygen:配置相应文件、函数说明项。 1、扩展商店&#xff0c;搜索Doxygen&#xff0c;如下图1&#xff0c;安装。 图1 2、设置项中&#xff0c;选择扩展设置&#xff0c;如图2 图2 3、配置版本、作者邮箱、作者名称、日期格式等等&#xff0c;如图3 4、定义函数后&…...

指 针

1.指针指针的作用: 可以通过指针间接访问内存&#xff08;可以通过指针的保存一个地址&#xff08;指针--地址&#xff09;&#xff09;内存编号是从0开始记录的&#xff0c;一般用十六进制数字表示。可以利用指针变量保存地址指针变量的定义和使用指针变是定义语法: 数据类型 …...

安卓小游戏:俄罗斯方块

安卓小游戏&#xff1a;俄罗斯方块 前言 最近用安卓自定义view写了下飞机大战、贪吃蛇、小板弹球三个游戏&#xff0c;还是比较简单的&#xff0c;这几天又把俄罗斯方块还原了一下&#xff0c;写了一天&#xff0c;又摸鱼调试了两天&#xff0c;逻辑不是很难&#xff0c;但是…...

NC113 验证IP地址

验证IP地址_牛客题霸_牛客网 描述 编写一个函数来验证输入的字符串是否是有效的 IPv4 或 IPv6 地址 IPv4 地址由十进制数和点来表示&#xff0c;每个地址包含4个十进制数&#xff0c;其范围为 0 - 255&#xff0c; 用(".")分割。比如&#xff0c;172.16.254.1&#…...

工业安全零事故的智能守护者:一体化AI智能安防平台

前言&#xff1a; 通过AI视觉技术&#xff0c;为船厂提供全面的安全监控解决方案&#xff0c;涵盖交通违规检测、起重机轨道安全、非法入侵检测、盗窃防范、安全规范执行监控等多个方面&#xff0c;能够实现对应负责人反馈机制&#xff0c;并最终实现数据的统计报表。提升船厂…...

java 实现excel文件转pdf | 无水印 | 无限制

文章目录 目录 文章目录 前言 1.项目远程仓库配置 2.pom文件引入相关依赖 3.代码破解 二、Excel转PDF 1.代码实现 2.Aspose.License.xml 授权文件 总结 前言 java处理excel转pdf一直没找到什么好用的免费jar包工具,自己手写的难度,恐怕高级程序员花费一年的事件,也…...

在四层代理中还原真实客户端ngx_stream_realip_module

一、模块原理与价值 PROXY Protocol 回溯 第三方负载均衡&#xff08;如 HAProxy、AWS NLB、阿里 SLB&#xff09;发起上游连接时&#xff0c;将真实客户端 IP/Port 写入 PROXY Protocol v1/v2 头。Stream 层接收到头部后&#xff0c;ngx_stream_realip_module 从中提取原始信息…...

React19源码系列之 事件插件系统

事件类别 事件类型 定义 文档 Event Event 接口表示在 EventTarget 上出现的事件。 Event - Web API | MDN UIEvent UIEvent 接口表示简单的用户界面事件。 UIEvent - Web API | MDN KeyboardEvent KeyboardEvent 对象描述了用户与键盘的交互。 KeyboardEvent - Web…...

视频字幕质量评估的大规模细粒度基准

大家读完觉得有帮助记得关注和点赞&#xff01;&#xff01;&#xff01; 摘要 视频字幕在文本到视频生成任务中起着至关重要的作用&#xff0c;因为它们的质量直接影响所生成视频的语义连贯性和视觉保真度。尽管大型视觉-语言模型&#xff08;VLMs&#xff09;在字幕生成方面…...

Mac软件卸载指南,简单易懂!

刚和Adobe分手&#xff0c;它却总在Library里给你写"回忆录"&#xff1f;卸载的Final Cut Pro像电子幽灵般阴魂不散&#xff1f;总是会有残留文件&#xff0c;别慌&#xff01;这份Mac软件卸载指南&#xff0c;将用最硬核的方式教你"数字分手术"&#xff0…...

TRS收益互换:跨境资本流动的金融创新工具与系统化解决方案

一、TRS收益互换的本质与业务逻辑 &#xff08;一&#xff09;概念解析 TRS&#xff08;Total Return Swap&#xff09;收益互换是一种金融衍生工具&#xff0c;指交易双方约定在未来一定期限内&#xff0c;基于特定资产或指数的表现进行现金流交换的协议。其核心特征包括&am…...

#Uniapp篇:chrome调试unapp适配

chrome调试设备----使用Android模拟机开发调试移动端页面 Chrome://inspect/#devices MuMu模拟器Edge浏览器&#xff1a;Android原生APP嵌入的H5页面元素定位 chrome://inspect/#devices uniapp单位适配 根路径下 postcss.config.js 需要装这些插件 “postcss”: “^8.5.…...

MySQL:分区的基本使用

目录 一、什么是分区二、有什么作用三、分类四、创建分区五、删除分区 一、什么是分区 MySQL 分区&#xff08;Partitioning&#xff09;是一种将单张表的数据逻辑上拆分成多个物理部分的技术。这些物理部分&#xff08;分区&#xff09;可以独立存储、管理和优化&#xff0c;…...

sshd代码修改banner

sshd服务连接之后会收到字符串&#xff1a; SSH-2.0-OpenSSH_9.5 容易被hacker识别此服务为sshd服务。 是否可以通过修改此banner达到让人无法识别此服务的目的呢&#xff1f; 不能。因为这是写的SSH的协议中的。 也就是协议规定了banner必须这么写。 SSH- 开头&#xff0c…...