项目中安装依赖 npm install clipboard --save
引入模块 import Clipboard from 'clipboard'
在点击的元素上绑定 :data-clipboard-tex 绑定值就是期望要拷贝的值
代码
<template>
<div class="copy-msg" @click="copeMsgFun" :data-clipboard-text="viewerMsg">
{{viewerMsg}}
</div>
</template>
<script type="text/javascript">
import Clipboard from 'clipboard'
export default {
data () {
return {
viewerMsg:'拷贝文件的信息。。。。'
}
},
methods:{
copeMsgFun(){
let clipboard = new Clipboard('.copy-msg');
clipboard.on('success',(e) => {
this.$message.success('复制成功')
//此时已经拷贝出来viewrMsg的信息 ctrl+v即可看到
clipboard.destroy()
})
}
}
}
</script>