项目中复制功能

1.开发环境 vue
2.电脑系统 windows10专业版
3.在开发的过程中,我们可能会遇到复制的功能,下面我来分享一下我遇到的问题和解决方法,希望对你有帮助。
4.对于复制功能,我是通过clipboard.js进行解决的:

http://www.clipboardjs.cn/
//第一步:进行安装 ,npm 命令为:
npm install clipboard --save

5.我来分享一下简单的使用:

一个很常见的用例是从另外以一个元素复制内容。你可以给目标元素添加一个 data-clipboard-target属性来实现这个功能。这个属性的值就是能匹配到另一个元素的选择器,下面是简单的使用

代码:

复制

//在methods中添加如下代码:
chencopy() {
    let clipboard = new this.clipboard(".btn");
    clipboard.on("success", function (e) {
    console.info("复制成功");
    console.info(e);
    });
    clipboard.on("error", function () {
    console.error("复制失败");
    });
},

效果如下:

6.本期的分享到了这里就结束啦,是不是很nice,希望对你有所帮助,让我们一起努力走向巅峰!