插件地址
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>