VUE 实现复制粘贴 clipboard
发布日期:2021-10-16 12:05:08
浏览次数:8
分类:技术文章
本文共 1106 字,大约阅读时间需要 3 分钟。
1、安装 npm install clipboard --save
2、引用 import Clipboard from ‘clipboard’ 3、使用方法一复制 // methodscopy(e) { const clipboard = new Clipboard(e.target, { text: () => '复制的内容' }) clipboard.on('success', e => { this.$message({ type: 'success', message: '复制成功' }) clipboard.destroy() // 释放内存 }) clipboard.on('error', e => { this.$message({ type: 'waning', message: '该浏览器不支持自动复制' }) clipboard.destroy() }) clipboard.onClick(e) // 事件绑定 }
4、使用方法二
{ { code }} <-- 作为选择器的标识使用用class也行 --> :data-clipboard-text="复制的内容" class="el-icon-document" title="点击复制" @click="copy()"/> // methodscopy() { const clipboard = new Clipboard("#tag-copy") // 或者不绑定 const clipboard = new Clipboard("#tag-copy", () => '复制的内容') clipboard.on('success', e => { this.$message({ type: 'success', message: '复制成功' }) clipboard.destroy() // 释放内存 }) clipboard.on('error', e => { this.$message({ type: 'waning', message: '该浏览器不支持自动复制' }) clipboard.destroy() }) }
转载地址:https://blog.csdn.net/snow51/article/details/89011997 如侵犯您的版权,请留言回复原文章的地址,我们会给您删除此文章,给您带来不便请您谅解!
发表评论
最新留言
不错!
[***.144.177.141]2024年04月07日 21时43分15秒
关于作者
喝酒易醉,品茶养心,人生如梦,品茶悟道,何以解忧?唯有杜康!
-- 愿君每日到此一游!
推荐文章
LinuxGPIO操作和MTK平台GPIO
2021-06-30
Linux下的图形库curses写贪吃蛇,酷
2021-06-30
在asp.net中为Web用户控件添加属性和事件
2021-06-30
datagrid的正反双向排序
2021-06-30
在分页状态下删除纪录的问题
2021-06-30
使用DataGrid动态绑定DropDownList
2021-06-30
DataGrid删除确认及Item颜色交替
2019-04-27
NetBeans配置Xdebug 远程调试PHP
2019-04-27
MediaWiki安装
2019-04-27
Squid安装
2019-04-27
如何查看当前Linux的版本
2019-04-27
Ubuntu安装Nginx
2019-04-27
Ubuntu 下安装thttpd Web服务器
2019-04-27
用thttpd做Web Server
2019-04-27
服务器端开发经验总结 Linux C语言
2019-04-27
将网站程序放在tmpfs下
2019-04-27
使用Nginx的proxy_cache缓存功能取代Squid
2019-04-27
nginx 反向代理,动静态请求分离,proxy_cache缓存及缓存清除
2019-04-27
nginx 的proxy_cache才是王道
2019-04-27
Nginx proxy_cache 使用示例
2019-04-27