经常遇到一键复制功能,简单记录一下。这里使用的是clipboard插件:https://clipboardjs.com/

  第一步

    安装:npm install clipboard --save

  第二步: 

    引入:

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

  第三步:

    使用:

      <button data-clipboard-action="copy" class="cobyDomObj" :data-clipboard-text="复制内容" @click="copyLink">
        复制按钮
      </button>

      copyLink() {
        let _this = this;
        let clipboardObj = new this.clipboard(".cobyDomObj");
        clipboardObj .on('success', function () {
          _this.$toast("复制成功")
        });
        clipboardObj .on('error', function () {
          _this.$toast("复制失败")
        });
      }

  

一键复制功能 - Vue的更多相关文章

  1. (英文版)VScode一键生成.vue模板

    1. 安装vscode,官网地址 2.安装一个插件,识别vue文件 插件库中搜索Vetur,下图中的第一个,点击安装(Install) 3.新建代码片段 点击Code(代码)-Preferences( ...

  2. js插件实现一键复制功能

    clipboard.js 可以实现纯 JS 的从浏览器复制文本到系统剪贴板的功能. 使用方法: 1. 下载 clipboard.js,并在页面中引入该插件.clipboard.js 下载地址: htt ...

  3. VSCode 初次写vue项目并一键生成.vue模版

    VSCode 写vue项目一键生成.vue模版 1.新建代码片段 文件-->首选项-->用户代码片段-->点击新建代码片段--取名vue.json 确定 2.配置快捷生成的vue模板 ...

  4. 【vsCode】识别.vue/一键生成.vue模板文件

    1.安装插件Vetur 结果 ---> .vue代码识别彩标 2.配置.vue文件模板,以便快速一键生成格式化 2.1新建代码片段 File->Preferences->User S ...

  5. JS实现一键复制功能

    var copyClick = function (d) { var Url2 = $(d).parent().parent().find("#copy_value"); Url2 ...

  6. cocos2dx 实现文字的一键复制功能(IOS、Android)

    1.IOS篇(用OC和C++混编) 头文件声明: public static void copy(std::string str); 实现如下: void copy(std::string str) ...

  7. H5 页面 上使用js实现一键复制功能

    2.解决苹果手机浏览器 无法使用的问题  上面的方法在 iphone 手机 safari浏览器失效的问题 其实就是使用输入框先显示然后模拟选择复制在隐藏输入框

  8. vscode vue 模版生成,vue 一键生成

    vscode vue 模版 继上篇文章(vue 格式化),顺便记录下 vue 模版生成.图片就不在贴了,如果有找不到 vscode 插件商店的可以访问上篇文章. 一.安装 VueHelper 在 vs ...

  9. vue学习第一天 ------ 临时笔记

    学习链接 Vue2+VueRouter2+Webpack+Axios 构建项目实战2017重制版(一)基础知识概述 http://blog.csdn.net/fungleo/article/detai ...

随机推荐

  1. python基础之01数据类型-变量-运算浅解

    python的数据类型 1  数字 数字分为整型(int),长整型(long),浮点型(float),复数(complex) 整型较为常用的功能: >>> a=-4 >> ...

  2. 企业级镜像管理系统Harbor

    Harbor简介 在说harbor之前,我们首先说一说直接使用docker registry的一些缺陷: 缺少认证机制,任何人都可以随意拉取及上传镜像,安全性缺失 缺乏镜像清理机制,镜像可以push却 ...

  3. HTML常用标签-<body>内基本标签(块级标签和内联标签)

    HTML常用标签-<body>内基本标签(块级标签和内联标签) 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.<hn>系列标签 n的取值范围是1~6,从 ...

  4. matlab和C语言实现最小二乘法

    参考:https://blog.csdn.net/zengxiantao1994/article/details/70210662 Matlab代码: N = ; x = [ ]; y = [ ]; ...

  5. 笔记 jquery 的一个bug解决方法积累

    本博客是自己在学习和工作途中的积累与总结,仅供自己参考,也欢迎大家转载,转载时请注明出处 当id或匹配条件中包含特殊字符时,浏览器控制台会报缺少")"的异常,解决办法目前有两个: ...

  6. bzoj千题计划131:bzoj3993: [SDOI2015]星际战争

    http://www.lydsy.com/JudgeOnline/problem.php?id=3993 二分答案 源点向武器连 mid*攻击力的边 机器人向汇点连 防御力 的边 武器i能攻击机器人j ...

  7. c# 判断一个数是不是质数或者求一个数的公约数的算法

    一个数是不是质数,就是判断一个数除了1和它本身还有没有其他的约数,如果有则是合数,否则是质数.其实本质都是求公约数. 求公约数是什么思路呢,就是找比它小的数不断尝试,能被整除则是其约数,否则继续尝试, ...

  8. 细说 struct和typedef struct

    细说 struct和typedef struct 参考原文:http://www.cnblogs.com/qyaizs/articles/2039101.html,有些小改动~ 1 首先://注意在C ...

  9. windows git gui右键sublime打开当前文件编辑

    git安装目录\Git\libexec\git-core\git-gui.tcl的 proc create_common_diff_popup 下追加: $ctxm add command \ -la ...

  10. 【BZOJ】4559: [JLoi2016]成绩比较 计数DP+排列组合+拉格朗日插值

    [题意]n位同学(其中一位是B神),m门必修课,每门必修课的分数是[1,Ui].B神碾压了k位同学(所有课分数<=B神),且第x门课有rx-1位同学的分数高于B神,求满足条件的分数情况数.当有一 ...