vue项目中使用vue-clipboard2复制文本

步骤一终端安装:

npm install --save vue-clipboard2

 步骤二main.js 配置:

import VueClipboard from 'vue-clipboard2'

Vue.use(VueClipboard);

 

步骤三页面使用:

<div>
<span>
H5页面链接:{{url}}
<span
style="color:#169BD5;cursor: pointer;margin-left:10px"
v-clipboard:copy="url"       //复制的变量,在这里面
v-clipboard:success="onCopyUrl"   //复制成功之后执行这个函数,可以在里面塞成功提示
v-clipboard:error="onErrorUrl"      //复制失败之后执行这个函数,可以在里面塞失败提示
>复制链接</span>
</span>
</div>

onCopyUrl() {
this.$message.success("复制成功!");
},
onErrorUrl() {
this.$message.error("复制失败!");
},

结论:反正比clipboard好用,操作步骤少,不搞心态

posted @ 2022-05-06 18:21  ZQ-404  阅读(308)  评论(0)    收藏  举报