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>
參考鏈接:參考文檔