1、安装vue-clipboard2插件
npm install --save vue-clipboard2
2、在main.js文件中,添加这个插件的引用:
import VueClipboard from 'vue-clipboard2'
Vue.use(VueClipboard)
3、在项目中使用这个插件的方法:
<template>
<div class="box">
<input v-model='copyText' />
<button class="button"
v-clipboard:copy="copyText"
v-clipboard:success="onCopy"
v-clipboard:error="onError">点击复制</button>
</div>
</template>
<script>
export default {
data(){
return {
copyText: ''
}
},
methods: {
// 复制成功
onCopy(e){
alert("复制成功");
},
// 复制失败
onError(e){
alert("失败");
},
}
}
</script>
参考链接:参考文档