vue实现文本复制
一. 下载插件
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实现文本复制的更多相关文章
- js文本复制插件&vue
/* HTML: * <a href="javascript:;" class="copy" data-clipboard-text="copy ...
- 用FileInputStream实现文本复制
import java.io.FileInputStream; import java.io.FileOutputStream; import java.io.IOException; /* * 用f ...
- JS实现文本复制与剪切
我们在网页上放置一个复制按钮,主要用来方便用户复制链接之类的复杂文本,以往的做法是,通过JS依靠Flash,甚至借助jQuery庞大的js库来实现文本复制到剪贴板的.今天我要给大家介绍的是一款极现代的 ...
- js-将文本复制到剪切板
// 将文本复制到剪切板 var clipboard2 = new ClipboardJS('.add_wx_guide_float', { text: function(trigger) { ret ...
- vue单位文本控件与vue加密文本控件
vue单位文本控件: 使用方式: npm install dami-text-input --save 使用: <text-input v-model="test" :uni ...
- vue+富文本编辑器UEditor
vue+富文本编辑器UEditor 昨天的需求是把textarea换成富文本编辑器的形式, 网上找了几种富文本编辑器ueditor.tinymce等, 觉得ueditor实现双向绑定还挺有意思, 分享 ...
- iOS-开发将文本复制到剪切板
下面方法可以将文本复制到剪切板 UIPasteboard *pboard = [UIPasteboard generalPasteboard]; pboard.string = @"邀请码& ...
- vue点击复制文本粘贴
<template> <ul> <li> <input type="text" class="inpNone&quo ...
- vue 富文本编辑器 项目实战用法
1.挑个富文本编辑器 首先针对自己项目的类型,确定自己要用啥编辑器. 1.1 wangeditor 如果一般类似博客这种项目不需要花里胡哨的,功能也不要求贼多的,推荐一下wangeditor(点击跳转 ...
- ZeroClipboard 插件实现文本复制到剪贴板
ZeroClipboard 的官网 点这里,github地址 点这里. 事例如下: 在引入 ZeroClipboard.js 之后, <button id="clip_button&q ...
随机推荐
- allure测试报告美化与定制
一份简单的测试报告 一份简单的测试报告可以使用pytest的插件html就可以生成, demo如下 先下载 pip install pytest-html 下载完之后,在当前执行过测试用例的测试目录下 ...
- 2022-10-08:以下go语言代码输出什么?A、0 0;B、0 4;C:4 0;D:4 4。 package main const s = “Go101.org“ // len(s) == 9
2022-10-08:以下go语言代码输出什么?A.0 0:B.0 4:C:4 0:D:4 4. package main const s = "Go101.org" // len ...
- 2020-10-07:redis存在线程安全的问题吗?为什么?
福哥答案2020-10-07:#福大大架构师每日一题# Redis6.0的多线程部分只是用来处理网络数据的读写和协议解析,执行命令仍然是单线程顺序执行.所以我们不需要去考虑控制 key.lua.事务, ...
- 2022-08-18:每一个序列都是[a,b]的形式,a < b 序列连接的方式为,前一个序列的b,要等于后一个序列的a 比如 : [3, 7]、[7, 13]、[13, 26]这三个序列就可以依次连
2022-08-18:每一个序列都是[a,b]的形式,a < b 序列连接的方式为,前一个序列的b,要等于后一个序列的a 比如 : [3, 7].[7, 13].[13, 26]这三个序列就可以 ...
- 2021-02-23:给定一个正数n,求n的裂开方法数。规定:后面的数不能比前面的数小 。比如4的裂开方法有: 1+1+1+1、1+1+2、1+3、2+2、4,5种,所以返回5。
2021-02-23:给定一个正数n,求n的裂开方法数.规定:后面的数不能比前面的数小 .比如4的裂开方法有: 1+1+1+1.1+1+2.1+3.2+2.4,5种,所以返回5. 福哥答案2021-0 ...
- macOS下由yarn与npm差异引发的Electron镜像地址读取问题
记录macOS下由yarn与npm差异引发的Electron镜像地址读取问题 写在前面:该问题仅仅出现在Linux和macOS上,Windows上不存在该问题! 初始背景 最近笔者重新拾起了Elect ...
- .Net使用第三方onnx或ModelBuilder轻松接入AI模型
ML.Net - 开源的跨平台机器学习框架 支持CPU/GPU训练 轻松简洁的预测代码 可扩展其他的机器学习平台 跨平台 1.使用Visual Studio的Model Builder训练和使用模型 ...
- flutter填坑之旅(环境搭建篇--mac系统)
上次配置过Mac到flutter环境,但是由于最近系统更新了,什么都没了又得从新配置,发现自己竟然好多都忘记了,看来还是得把它记下来才行 在Mac上安装并运行Flutter 最低要求: 操作系统:ma ...
- spring-boot集成mybatis真的很简单吗?
在日常的后端开发中,使用mybatis作为DAO层的持久框架已经是惯例.但很多时候都是在别人搭好的框架中进行开发,对怎么搭建环境是一知半解,今天就来实践下. 一.集成分哪些步骤 来看下集成mybati ...
- MQ系列12:如何保证消息顺序性
MQ系列1:消息中间件执行原理 MQ系列2:消息中间件的技术选型 MQ系列3:RocketMQ 架构分析 MQ系列4:NameServer 原理解析 MQ系列5:RocketMQ消息的发送模式 MQ系 ...