Clipboard 复制粘贴的使用

首先 npm install clipboard 安装依赖；

 1 import Vue from 'vue'
 2 import Clipboard from 'clipboard'
 3 
 4 function clipboardSuccess() {
 5   Vue.prototype.$message({
 6     message: '复制成功,ctrl+v进行粘贴',
 7     type: 'success'
 8   })
 9 }
10 
11 function clipboardError() {
12   Vue.prototype.$message({
13     message: '复制失败',
14     type: 'error'
15   })
16 }
17 
18 export default function handleClipboard(text, event) {
19   const clipboard = new Clipboard(event.target, {
20     text: () => text
21   })
22   clipboard.on('success', () => {
23     clipboardSuccess()
24     clipboard.destroy()
25   })
26   clipboard.on('error', () => {
27     clipboardError()
28     clipboard.destroy()
29   })
30   clipboard.onClick(event)
31 }

demo.vue

复制后直接粘贴即可。

import clipboard from "@/utils/clipboard"; <template>  　　<div @click="e => clipboard('复制的文字', e)">复制</div> </template>