版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq_15253407/article/details/89187358
// 使用环境： Vue-cli3 复制剪切板插件：clipboard
// 安装： npm install clipboard -save
<p
data-clipboard-action="copy"
:id="'copy-'+ elindex"
class="class-list-item__title"
:data-clipboard-text="classInfo.Name"
@mouseenter="copy('#copy-'+ elindex)"
@click="copy('#copy-'+ elindex)" >{{classInfo.Name}}</p>
// data-clipboard-action： 操作的动作 copy 复制
// data-clipboard-text 需要复制的内容
// 点击事件
copy(el) {
this.clipboard = new ClipboardJS(this.tools.$jQuery(el));
this.clipboard.on('success', e => {
this.$message({
message: '复制成功',
type: 'success'
});
this.clipboard.destroy();
});
this.clipboard.on('error', e => {
this.$message(e);
e.clearSelection();
this.clipboard.destroy();
});
},
// 处理点击两次复制的方式，借助mouseenter实现，当鼠标移入的时候执行一次，在接下来的点击事件中就可以正常复制。