一. 下载插件

npm install --save vue-clipboard2

二. main.js

import VueClipBoard from 'vue-clipboard2'

Vue.use(VueClipBoard)

三. 使用

html部分 点击查看代码
<el-button
size="mini"
type="text"
icon="el-icon-document-copy"
v-clipboard:copy="scope.row.productName"
v-clipboard:success="productNameCopySuccess"
v-clipboard:error="productNameCopyError"
>复制名称</el-button
>
js部分 点击查看代码
    productNameCopySuccess(e){
this.$modal.msgSuccess("复制名称成功,内容如下: "+ e.text);
},
productNameCopyError(e){
this.$modal.error("复制名称失败");
},

vue实现文本复制的更多相关文章

  1. js文本复制插件&vue

    /* HTML: * <a href="javascript:;" class="copy" data-clipboard-text="copy ...

  2. 用FileInputStream实现文本复制

    import java.io.FileInputStream; import java.io.FileOutputStream; import java.io.IOException; /* * 用f ...

  3. JS实现文本复制与剪切

    我们在网页上放置一个复制按钮,主要用来方便用户复制链接之类的复杂文本,以往的做法是,通过JS依靠Flash,甚至借助jQuery庞大的js库来实现文本复制到剪贴板的.今天我要给大家介绍的是一款极现代的 ...

  4. js-将文本复制到剪切板

    // 将文本复制到剪切板 var clipboard2 = new ClipboardJS('.add_wx_guide_float', { text: function(trigger) { ret ...

  5. vue单位文本控件与vue加密文本控件

    vue单位文本控件: 使用方式: npm install dami-text-input --save 使用: <text-input v-model="test" :uni ...

  6. vue+富文本编辑器UEditor

    vue+富文本编辑器UEditor 昨天的需求是把textarea换成富文本编辑器的形式, 网上找了几种富文本编辑器ueditor.tinymce等, 觉得ueditor实现双向绑定还挺有意思, 分享 ...

  7. iOS-开发将文本复制到剪切板

    下面方法可以将文本复制到剪切板 UIPasteboard *pboard = [UIPasteboard generalPasteboard]; pboard.string = @"邀请码& ...

  8. vue点击复制文本粘贴

    <template>  <ul>      <li> <input type="text" class="inpNone&quo ...

  9. vue 富文本编辑器 项目实战用法

    1.挑个富文本编辑器 首先针对自己项目的类型,确定自己要用啥编辑器. 1.1 wangeditor 如果一般类似博客这种项目不需要花里胡哨的,功能也不要求贼多的,推荐一下wangeditor(点击跳转 ...

  10. ZeroClipboard 插件实现文本复制到剪贴板

    ZeroClipboard 的官网 点这里,github地址 点这里. 事例如下: 在引入 ZeroClipboard.js 之后, <button id="clip_button&q ...

随机推荐

  1. 通过空间占用和执行计划了解SQL Server的行存储索引

    1 索引介绍 索引是一种帮助查询语句能够快速定位到数据的一种技术.索引的存储方式有行存储索引.列存储索引和内存优化三种存储方式: 行存储索引,使用B+树结构,行存储指的是数据存储格式为堆.聚集索引和内 ...

  2. 2023-04-22:给你两个正整数数组 nums 和 target ,两个数组长度相等。 在一次操作中,你可以选择两个 不同 的下标 i 和 j , 其中 0 <= i, j < nums.leng

    2023-04-22:给你两个正整数数组 nums 和 target ,两个数组长度相等. 在一次操作中,你可以选择两个 不同 的下标 i 和 j , 其中 0 <= i, j < num ...

  3. 2022-08-01:以下go语言代码输出什么?A:panic;B:5;C:6;D:编译错误。 package main import ( “fmt“ ) func main() {

    2022-08-01:以下go语言代码输出什么?A:panic:B:5:C:6:D:编译错误. package main import ( "fmt" ) func main() ...

  4. 2021-11-27:给定一个数组arr,长度为N,做出一个结构,可以高效的做如下的查询: 1) int querySum(L,R) : 查询arr[L...R]上的累加和; 2) int query

    2021-11-27:给定一个数组arr,长度为N,做出一个结构,可以高效的做如下的查询: int querySum(L,R) : 查询arr[L-R]上的累加和; int queryAim(L,R) ...

  5. 基于DevExpress的GridControl实现的一些界面处理功能

    DevExpress的GridControl控件能够提供很多强大的操作,其视图GridView能够通过各种设置,呈现出多种复杂的界面效果,本篇随笔探讨一些常见的GridControl控件及其GridV ...

  6. c3p0的配置及简单应用

    首先简单了解一下JDBC和c3p0 Java数据库连接,(Java Database Connectivity,简称JDBC)是Java语言中用来规范客户端程序如何来访问数据库的应用程序接口,提供了诸 ...

  7. 非AI文生图,献丑了

    多图预警! 大家好,我是 DOM哥 也许你会好奇上面的这几张图片是怎么生成的,接下来我就开始隆重介绍这款文生图工具 当然,并非 AI 的那个文生图啦 预览地址:https://dombro.site/ ...

  8. openlayers Text字体大小设置

    今做一个app版的ol地图,发现区域太小显示拥挤,于是想把字体改小,看起来匀称点,于是盯紧了font属性使劲改 老是不听咋整呢?网上找大佬 于是找到了得到了各路大神鼎力相助 如: 赶紧跑去试试,原来这 ...

  9. 微软New Bing Chat AI聊天免费体验(需要魔法~)

    必应聊天是什么? Bing Chat是一个AI 聊天机器人,它可以理解您问题的上下文并以人性化的方式回复.Microsoft 已将此功能直接集成到Bing 搜索中,使 Bing 成为搜索结果和AI 支 ...

  10. 【Python&GIS】矢量数据投影转换(WGS84转地方坐标系)

         又是掉头发的一天,今天的任务是将WGS84坐标系的点转成地方坐标系,并判断点是否在某个面内,找了半天的资料什么四参数.七参数啥的太复杂了.这里使用Python的ogr, osr库内置的坐标转 ...