Vue点击复制到剪切板

一、Vue2写法

安装 (官网地址)

npm install --save vue-clipboard2

使用

//main.js
import VueClipboard from 'vue-clipboard2'
Vue.use(VueClipboard)//页面使用
<button type="button"v-clipboard:copy="message"v-clipboard:success="onCopy"v-clipboard:error="onError">Copy!</button>

二、Vue3写法

安装 (官网地址)

npm install --save vue-clipboard3

or

yarn add vue-clipboard3

使用 


//引入
import useClipboard from 'vue-clipboard3'
const { toClipboard } = useClipboard()//使用
const copy = async () => {try {await toClipboard(location.href)console.log('Copied to clipboard')} catch (e) {console.error(e)}
}

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

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

相关文章

Mac电脑软件开发的优缺点

Mac电脑软件开发的优缺点 在软件开发领域&#xff0c;Mac电脑一直以其独特的优势占有一席之地。然而&#xff0c;就像任何工具或平台一样&#xff0c;Mac电脑在软件开发方面也存在其优点和缺点。本文将探讨在Mac上进行软件开发的利弊&#xff0c;帮助您了解是否应将Mac作为您的…

node.js 用 xml2js.Parser 读 Freeplane.mm文件,生成测试用例.csv文件

Freeplane 是一款基于 Java 的开源软件&#xff0c;继承 Freemind 的思维导图工具软件&#xff0c;它扩展了知识管理功能&#xff0c;在 Freemind 上增加了一些额外的功能&#xff0c;比如数学公式、节点属性面板等。 编写 mm_xml2js_csv.js 如下 // 用 xml2js.Parser 读 F…

Android 通过Intent打开第三方App

Android 使用 Intent 打开第三方应用或调用制定 Activity Intent intent new Intent(); intent.setClassName("package name", "activity name"); // 内部调用 intent.setComponent(new ComponentName("package name", "activity name&qu…

javaWebssh票据管理系统myeclipse开发mysql数据库MVC模式java编程计算机网页设计

一、源码特点 java ssh票据管理系统是一套完善的web设计系统&#xff08;系统采用ssh框架进行设计开发&#xff09;&#xff0c;对理解JSP java编程开发语言有帮助&#xff0c;系统具有完整的源代码和数据库&#xff0c;系统主要采用B/S模 式开发。开发环境为TOMCAT7.0,My…

C++ 快速排序快速选择

目录 1、75. 颜色分类 2、912. 排序数组 3、 215. 数组中的第K个最大元素 4、LCR 159. 库存管理 III 1、75. 颜色分类 思路&#xff1a;利用快速排序思路&#xff0c;使用三指针分块进行优化。 [0,left]——小于key[left1,right-1]——等于key[right,nums.size()]——大于k…

博途PLC 面向对象系列之“输送带控制功能块“(SCL代码)

这篇是面向对象系列之"输送带功能块"的封装,面向对象是系列文章,相关链接如下: 1、面向对象系列之找"对象" https://rxxw-control.blog.csdn.net/article/details/136150027https://rxxw-control.blog.csdn.net/article/details/1361500272、面向对象…

LeetCode 刷题 [C++] 第215题.数组中的第K个最大元素

题目描述 给定整数数组 nums 和整数 k&#xff0c;请返回数组中第 k 个最大的元素。 请注意&#xff0c;你需要找的是数组排序后的第 k 个最大的元素&#xff0c;而不是第 k 个不同的元素。 你必须设计并实现时间复杂度为 O(n) 的算法解决此问题。 题目分析 根据题意分析&…

MYSQL 删除命令 delete、truncate 、drop

目录 一、delete 二、truncate 三、drop 四、delete&#xff0c;drop&#xff0c;truncate的区别 一、delete 作用&#xff1a;仅仅删除表数据&#xff0c;表结构保留&#xff0c;数据能回滚 命令格式 #删除全部数据 delete from 表名;#删除表中id为1的数据&#xff0c;…

CleanMyMac X2024一款专为Mac用户设计的优化工具

亲爱的用户们&#xff0c;我们都知道电脑在长时间使用后会变得越来越慢&#xff0c;垃圾文件和无用的应用程序会占用我们的硬盘空间&#xff0c;让我们的电脑变得像蜗牛一样慢。但是&#xff0c;现在有一个解决方案可以让你的电脑重获新生&#xff0c;那就是CleanMyMac X&#…

oracle锁表

select alter system kill session ||sess.sid||,||sess.serial#||; bb,sess.sid,sess.serial#, lo.oracle_username,--登录账号lo.os_user_name,--登录电脑ao.object_name,--被锁表名lo.locked_mode --锁住级别from v$locked_object lo,dba_objects ao,v$session sess where a…

第七十一天 漏洞发现-Web框架中间件联动GobyAfrogXrayAwvsVulmap

第71天 漏洞发现-Web框架中间件&联动&Goby&Afrog&Xray&Awvs&Vulmap 知识点&#xff1a; 1、Bup简单介绍&使用说明 2、Xray简单介绍&使用说明 3、AWWS简单介绍&使用说明 4、Goby简单介绍&使用说明 5、Afrog简单介绍&使用说明 6、…

泰迪智能科技企业数据挖掘平台使用场景

企业数据挖掘平台助力企业数据挖掘&#xff0c;数据挖掘平台也在多个领域发挥着重要的作用。 企业数据挖掘平台具有数据抓取、数据清洗、数据分析、机器学习等多项功能&#xff0c;广泛应用于企业的各个领域&#xff0c;包括&#xff1a;金融行业、医疗行业、交通领域、教育、制…

学习linux从0到工程师(命令)-4

基本命令 uname -m 显示机器的处理器架构 uname -r 显示正在使用的内核版本 dmidecode -q 显示硬件系统部件 (SMBIOS / DMI) hdparm -i /dev/hda 罗列一个磁盘的架构特性 hdparm -tT /dev/sda 在磁盘上执行测试性读取操作系统信息 arch 显示机器的处理器架构 uname -m 显示机器…

在OceanBase使用中,如何优化因Join估算不准导致执行计划选错的问题

作者&#xff1a;胡呈清&#xff0c;爱可生公司旗下的DBA团队成员&#xff0c;擅长故障分析和性能优化。爱可生开源社区出品&#xff0c;原创内容未经授权不得随意使用&#xff0c;转载请联系小编并注明来源。本文约 1600 字&#xff0c;预计阅读需要 15 分钟。 数据库版本&…

RunnerGo UI自动化测试脚本如何配置

RunnerGo提供从API管理到API性能再到可视化的API自动化、UI自动化测试功能模块&#xff0c;覆盖了整个产品测试周期。 RunnerGo UI自动化基于Selenium浏览器自动化方案构建&#xff0c;内嵌高度可复用的测试脚本&#xff0c;测试团队无需复杂的代码编写即可开展低代码的自动化…

OpenXR 超详细的spec

3.API 初始化 3.2 Function Pointers XrResult xrGetInstanceProcAddr(XrInstance instance,const char* name,PFN_xrVoidFunction* function); instance: XrInstance类型&#…

【LeetCode】121. 买卖股票的最佳时机(简单)——代码随想录算法训练营Day48

题目链接&#xff1a;121. 买卖股票的最佳时机 题目描述 给定一个数组 prices &#xff0c;它的第 i 个元素 prices[i] 表示一支给定股票第 i 天的价格。 你只能选择 某一天 买入这只股票&#xff0c;并选择在 未来的某一个不同的日子 卖出该股票。设计一个算法来计算你所能…

BetterDisplay Pro for Mac v2.0.11激活版:屏幕显示优化专家

BetterDisplay Pro是一款由waydabber开发的Mac平台上的显示器校准软件&#xff0c;可以帮助用户调整显示器的颜色和亮度&#xff0c;以获得更加真实、清晰和舒适的视觉体验。 软件下载&#xff1a;BetterDisplay Pro for Mac v2.0.11激活版下载 &#x1f50d; 精准校准&#xf…

Unity的相机跟随和第三人称视角

Unity相机跟随和第三人称视角 介绍镜头视角跟随人物方向进行旋转的镜头视角固定球和人的镜头视角 思路跟随人物方向进行旋转的镜头视角固定球和人的镜头视角 镜头旋转代码人物移动的参考代码注意 介绍 最近足球项目的镜头在做改动&#xff0c;观察了一下实况足球的视角&#x…

npm digital envelope routines::unsupported

问题描述&#xff1a;npm运行命令报错&#xff1a;digital envelope routines::unsupported 原因&#xff1a;node版本过高 解决方案&#xff1a;在运行命令之前加上 SET NODE_OPTIONS--openssl-legacy-provider && SET NODE_OPTIONS--openssl-legacy-provider &&a…