1、首先安装插件npm install --save vue-clipboard2
官方文档点击前往
2、然后在项目入口文件main.js
中引入和安装插件 如下所示
import VueClipboard from 'vue-clipboard2' //引入插件
Vue.use(VueClipboard) //安装插件
3、在需要使用复制功能的地方使用 如下
HTML部分
<!-- onCopy表示复制成功的回调 -->
<span v-clipboard:copy=" '这里是你需要复制的内容(可以是变量)' " v-clipboard:success="onCopy">复制</span>
<!-- 变量的写法 -->
<span v-clipboard:copy="setPay" v-clipboard:success="onCopy">复制</span>
JS部分
data(){
return{
setPay:'我是需要复制的内容哈哈'
}
}
onCopy(){
window.alert('复制成功')
},