经常遇到一键复制功能,简单记录一下。这里使用的是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. 五、Linux学习之文件搜索命令

    一.文件搜索命令locate locate 文件名 在后台数据库中按文件名搜索,搜索速度最快 /var/lib/mlocate #locate命令所搜索的后台数据库(数据库不会实时刷新,所以新建的文件 ...

  2. GNU C ------ __attribute__

    attribute是GNU C特色之一,attribute可以设置函数属性(Function Attribute ).变量属性(Variable Attribute )和类型属性(Type Attri ...

  3. T51071 Tony到死都想不出の数学题

    T51071 Tony到死都想不出の数学题 自己摘的题出了数据挂一下链接 \(a, b\) 均为整数 设 \(M(a)\) 为满足 \((a + b) | ab\) 的 \(b\) 的个数, 求 \( ...

  4. codevs 3369 膜拜(线型)

    3369 膜拜 http://codevs.cn/problem/3369/ 题目描述 Description 神牛有很多…当然…每个同学都有自己衷心膜拜的神牛.某学校有两位神牛,神牛甲和神牛乙.新入 ...

  5. okhttp 简单用法

    1.gradle 依赖 github 中查找最新的 2.MyApplication oncreate 中: @Override public void onCreate () { super.onCr ...

  6. 用原生JS实现getElementsByClass

    直接用jQuery里Sizzle选择器那一段源码也行,自己写了一个 function getByClass(oParent,sClass){ var aEle = oParent.getElement ...

  7. spring框架学习(七)spring管理事务方式之xml配置

    1.DAO AccountDao.java package cn.mf.dao; public interface AccountDao { //加钱 void increaseMoney(Integ ...

  8. Elasticsearch技术解析与实战(一)基础概念及环境搭建

    序言 ES数据架构的主要概念(与关系数据库Mysql对比) 集群(cluster) 集群,一个ES集群由一个或多个节点(Node)组成,每个集群都有一个cluster name作为标识.一下是我们的4 ...

  9. 提高PowerShell脚本效率的五个常用方法

    PowerShell脚本运行慢怎么办?影响到正常企业流程正常运转怎么办?本文利用例子和数据给大家带来让PowerShell运行更快的五个常用方法.本人拙见,希望能够给大家带来一点启发~ 1. 善用命令 ...

  10. 20155235 2016-2017-2 《Java程序设计》第5周学习总结

    20155235 2016-2017-2 <Java程序设计>第5周学习总结 教材学习内容总结 第八章知识点 语法与继承结构 使用try.catch 异常继承结构 要抓还是要抛 贴心还是造 ...