vue之clipboard复制文本

使用clipboard.js

首先, 我们要先安装

npm install clipboard --save

然后, 在mian.js中引入,当然我们也可以在用到的.vue中单独引入,如果不止一个地方需要用到复制,可以直接在main.js里面引入。

import clipboard from 'clipboard';
Vue.prototype.clipboard = clipboard;

在单独界面需要用到复制文本的地方:

<div>手机号码:
   <span data-clipboard-action="copy" class="cobyOrderSn" :data-clipboard-text="tel" @click="copyLink">{{tel}}</span>
 </div>
copyLink() {
     let _this = this;
     let clipboard = new this.clipboard(".cobyOrderSn");
     clipboard.on('success', function () {
       _this.$toast("复制成功")
     });
     clipboard.on('error', function () {
       _this.$toast("复制失败")
     });
 }

如有错误,还请指正,如有帮助,请关注点赞哈。

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容