VUE使用插件vue-clipboard2复制到剪切板

1.安装

npm install --save vue-clipboard2

2.main.js

import Vue from 'vue'
import VueClipboard from 'vue-clipboard2'
 
Vue.use(VueClipboard)
  1. 方法一:copyText
<van-button @click="clickCopy()">复制</van-button>
clickCopy() {
    this.$copyText("www.baidu.com").then(
      res => {
        console.log(res);
        this.$toast("已成功复制,可直接去粘贴");
      },
      err => {
        this.$toast("复制失败");
      }
    );
  }

方法二 :v-clipboard:copy

<van-button
        v-clipboard:copy="getCopyUrl()"
        v-clipboard:success="onCopy"
        v-clipboard:error="onError"
        >复制</van-button
      >
getCopyUrl() {
    return "www.baidu.com";
  }
onCopy(res: any) {
    console.log(res.text);
    this.$toast("已成功复制,可直接去粘贴");
  }
  onError(error: any) {
    console.log(error);
    this.$toast("复制失败");
  }
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • js复制方法: 首先需要在页面中放置一个input标签,将其隐藏。将所要复制的值给予input标签,通过selec...
    小小肉松阅读 938评论 0 2
  • 参考使用clipboard.js复制页面内容到剪切板前端复制功能的若干 -- document.execComma...
    合肥黑阅读 2,999评论 1 3
  • ## 框架和库的区别?> 框架(framework):一套完整的软件设计架构和**解决方案**。> > 库(lib...
    Rui_bdad阅读 2,979评论 1 4
  • Sass&Gulp 一、sass介绍 (一) SASS是一种CSS的开发工具,提供了许多便利的写法,大大节省了设计...
    锋享前端阅读 1,539评论 0 3
  • 将文本复制到剪贴板的现代化方法。没有Flash。没有框架只有3kb的gzip压缩 为什么使用clipboard.j...
    筱雪儿00阅读 3,303评论 0 0