Clipboard.js 跳出多次复制成功的问题及其解决

本文探讨了在Vue.js项目中使用Clipboard.js时遇到的一个问题:点击复制按钮后,提示信息出现次数随页面进出而增加。文章分析了问题原因,并提供了解决方案——在离开页面前销毁Clipboard实例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

 本人用的vue.js

基本使用

参考

https://clipboardjs.com/         

自己的代码


问题 

 首先第一次进来点击 复制按钮 弹出提示 复制成功 这是没问题的,但是返回上级界面再次进来的时候 再次点击复制的时候会 弹出两次复制成功 ,据我

实践总结这是因为第一次来 this.clipboard= new Clipboard('.acctnobtn')的时候实例化了一次,返回上级界面第二次再次进入

这一界面的时候又this.clipboard= new Clipboard('.acctnobtn')了一次,所以说再次点击会弹出两次 复制成功,如果每次

关掉界面前不去销毁this.clipboard 这一实例的话,每次打开这一界面就会实例化 +1,所以要想解决这个问题的话必须每次关

掉这一界面前要销毁这一实例,参考上边代码

写博客写的不多 有可能写的不是多详细 多多担待

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值