vue2x使用clipboard复制数据

vue clipboard 复制 编程技术
发布日期 2023-01-09 更新日期 2023-01-15 阅读次数 85 文章字数 442

vue使用clipboard,要在dom加载完毕后,才能生成clipboard

并且每次重新加载时,要删除原来的clipboard对象,并生成新的clipboard对象

vue的dom渲染完毕回调为 $vue->$nextTick,例子:

//data
clipboard : null         
//加载完成后
                    that.$nextTick(function(){
                        if(vm.clipboard != null){
                            vm.clipboard.destroy();
                            vm.clipboard = null;
                        }
                        // 获取元素
                        var btns = document.querySelectorAll('.cpItem');
                        // 生成clipboard
                        var clipboard = new ClipboardJS(btns);
                        vm.clipboard = clipboard;
                        // 复制成功事件
                        clipboard.on('success', function(e) {
                            success_message("复制成功");
                        });
                        // 复制失败事件
                        clipboard.on('error', function(e) {
                            error_message("复制失败");
                        });
                    })

文章作者: 朱丰华

文章链接: https://smart.52dixiaowo.com/blog/post-309.html

版权声明: 本博客所有文章除特別声明外,均采用 CC BY 4.0 许可协议。

vue clipboard 复制

发表评论

相关推荐
朱丰华   |   1年前   |   linux · 文件

linux递归统计文件夹大小、du命令_Linux du命令:查看文件夹和文件的磁盘占用情况

193    评论    点赞
朱丰华   |   1年前   |   js · vue · 监听

js vue监听,深度监听

114    评论    点赞
朱丰华   |   1年前   |   vue · model

vue语法v-model原理与实现

122    评论    点赞
朱丰华   |   1年前   |   js · vue · npm · 安装

npm快速上手

100    评论    点赞
朱丰华   |   1年前   |   文件 · c语言 · include

C语言include语法,h文件和c文件的关系

96    评论    点赞
朱丰华   |   1年前   |   zend · php · 字符串 · _string

php扩展zend_string类型与char类型转换

96    评论    点赞
朱丰华   |   1年前   |   ImageMagick · pdf · png · windows

ImageMagick 把 pdf转png【windows】

44    评论    点赞
朱丰华   |   1年前   |   es5 · es6 · js · 函数 · 写法

js函数的es5和es6写法

48    评论    点赞
朱丰华   |   1年前   |   获取 · option · vue · 选中

vue获取选中的option值

41    评论    点赞
朱丰华   |   1年前   |   php · composer · linux · 安装

linux下安装composer

146    评论    点赞
朱丰华   |   2年前   |   表格 · 撑开 · css · 防止 · 太大 · border · break · 考虑 · table

css防止表格太大撑开

44    评论    点赞
朱丰华   |   2年前   |   数据 · 一对一 · mysql · 一对 · 改为 · 删除 · 重复 · 例如 · 原表 · select

mysql表数据去重,一对多改为一对一去重

73    评论    点赞
朱丰华   |   2年前   |   同步 · 结构 · 数据库 · mysql · 上线 · 比较 · 环境 · 修改 · 数据 · 工具

mysql同步线上线下数据库结构同步

147    评论    点赞
{{item.author_name}}   |   {{new Date(item.date*1000).log()}}   |   {{it}} ·

{{item.title}}

{{item.uv}}    评论    点赞