插件地址
clipboard.js 中文网
安装
npm install clipboard --save
使用示例
<template><div><div class="copyBtn" @click="copyText">复制文本</div ></div>
</template><script>
// 引入clipboard.js
import ClipboardJS from 'clipboard';export default {data() {return {textToCopy: '这是要复制的内容!', // 要复制的内容};},methods: {copyText() {// 创建新的 ClipboardJS 实例并传入按钮元素const clipboard = new ClipboardJS('.copyBtn', {text: () => this.textToCopy, // 动态获取复制的文本});// 成功复制后的回调clipboard.on('success', (e) => {console.log('复制成功:', e.text);//e.clearSelection(); // 清除选中的文本});// 失败时的回调clipboard.on('error', (e) => {console.error('复制失败:', e);});// 复制完成后销毁 clipboard.js 实例clipboard.on('success', () => {clipboard.destroy();});},},
};
</script>