专栏首页vue学习复制文字到剪贴板—Vue-clipboard2

复制文字到剪贴板—Vue-clipboard2

就这么一个简单的小组件,实现一个小功能;过了一段时间以后新需求要复现这个功能竟然又忘记了怎么写,又去找着github网址看了一下文档。。。。还是写下来。

1、安装

github上了解一下:Vue-clipboard2

$ npm install --save vue-clipboard2

2、使用

main.js中引入,当然你也可以在单个页面中引入。

引入

<template>
    <button class="btn" @click="doCopy">button</button>
</template>
doCopy() {
  this.$copyText('这里放入要粘贴的内容').then((e) => {
      // success
      console.log(e);
  }, (e) => {
      // fail
      console.log(e);
  });
}

3、结语

  • 我这是采用github官网示例中sample2的写法,我觉得是最简单的实现方式,其他的你可以去看看官网;
  • 希望这个功能以后五分钟能搞定,不要再费十分钟。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 27、有赞Vant组件库的引入及轮播图片预览的实现②

    这个vant组件与其它组件的引入方式不同,不需要在main.js中引入,直接在页面中引入即可:

    Ewall
  • 32、localStorage本地储存

    其实这种实现方式很不好,这章的主要意义还是在于localStorage这个知识点的运用,下章我们学着使用vuex来进行这个地址状态的管理。

    Ewall
  • 读《学习之道》— 搭建组块对抗发懵

    Ewall
  • CSS3模拟的iphone键盘

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www...

    meteoric
  • Angular 组件样式

    但某些时候我们需要根据不同的条件,为指定元素应用不同的样式。对于这种场景,我们可以使用属性绑定,如:

    semlinker
  • jquery中html、before、after、append、prepend应用

    <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf...

    闵开慧
  • jquery中hide、show、slideUp、slideDown、animate应用

    <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf...

    闵开慧
  • Random Forest

    随机森林还是没有脱离聚合模型这块,之前学过两个aggregation model,bagging和decision tree,一个是边learning边unif...

    西红柿炒鸡蛋
  • Random Forest

    随机森林还是没有脱离聚合模型这块,之前学过两个aggregation model,bagging和decision tree,一个是边learning边unif...

    西红柿炒鸡蛋
  • Python使用多进程提高网络爬虫的爬取速度

    多线程技术并不能充分利用硬件资源和大幅度提高系统吞吐量,类似需求应使用多进程编程技术满足。

    Python小屋屋主

扫码关注云+社区

领取腾讯云代金券