vue中实现浏览器的复制功能
点击复制,就可以实现copy
<p class="inline-block">
<span >{{fenxiao.appSecret}}</span>
<span style="color: #0000FF;cursor: pointer" @click="copyAppSecret">复制</span>
</p>
copyAppSecret() {
let createInput = document.createElement("input");
createInput.value = this.fenxiao.appSecret;
document.body.appendChild(createInput);
createInput.select(); // 选择对象
document.execCommand("Copy"); // 执行浏览器复制命令
createInput.style.display = "none";
this.$message({ message: "复制成功", type: "success" });
}, 网上说的那种
let tt=document.getElementById("xxxx")
tt.select(); // 选择对象
document.execCommand("Copy"); // 执行浏览器复制命令
文本是没有select
方法的,input才有 所以要先创建input元素,在添加值,在赋值,
亲测有效,换成el-input就能行
vue中实现浏览器的复制功能的更多相关文章
- Vue中结合clipboard实现复制功能
首先现在Vue中引入clipboard npm install clipboard --save 在需要使用的组件中import 引入clipboard import Clipboard from ' ...
- vue中npm run dev运行项目不能自动打开浏览器! 以及 webstorm跑vue项目jshint一直提示错误问题的解决方法!
vue中npm run dev运行项目不能自动打开浏览器!以及 webstorm跑vue项目jshint一直提示错误问题的解决方法! 1.上个项目结束就很久没有使用vue了,最近打算用vue搭建自己的 ...
- Vue中浏览器的的前进和后退
项目开发的时候,有时候可能需要我们来对页面后退和前进,这个东西跟浏览器自带的前进后退功能很像,下面来大致讲一下在vue中浏览器的前进和后退 一.后退功能 vue中的后退有好多种方法可以使用,使用这些方 ...
- vue中解决chrome浏览器自动播放音频 和MP3语音打包到线上
一.vue中解决chrome浏览器自动播放音频 需求 有新订单的时候,页面自动语音提示和弹出提示框: 问题 chrome浏览器在18年4月起,就在桌面浏览器全面禁止了音视频的自动播放功能.严格地来说, ...
- Vue中comoputed中的数据绑定
Vue中的数据实现响应式绑定是在初始化的时候利用definePrototype的定义set和get过滤器,在进行组件模板编译时实现water的监听搜集依赖项,当数据发生变化时在set中通过调用dep. ...
- Vue中应用CORS实现AJAX跨域,及它在 form data 和 request payload 的小坑处理
基本概念部分(一):理解CORS 说道Vue的跨域AJAX,我想先梳理一遍CORS跨域,"跨域资源共享"(Cross-origin resource sharing),它是一个W3 ...
- axios在vue中的简单配置与使用
一.axios 简介 axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征:https://hzzly.github.io/2017/03/12/ ...
- vue中引入babel步骤
vue中引入babel步骤 vue项目中普遍使用es6语法,但有时我们的项目需要兼容低版本浏览器,这时就需要引入babel插件,将es6转成es5. 1.安装babel-polyfill插件 npm ...
- vue中的路由的跳转的参数
vue中的路由跳转传参 params 与 query this.$router.push({ name:"detail", params:{ name:'nameValue', c ...
随机推荐
- Mac上的jdk
最近装jdk从网上找到的资料: 一.以前版本的Mac自带了的JDK6,安装在目录:/System/Library/Java/JavaVirtualMachines/1.6.0.jdk/下.* JDK7 ...
- weblogic初学笔记2-在Linux上部署项目
一.这两天在做部署项目到Linux服务器上. 网上有用war包部署的,也有把war包解压之后部署的.比如:http://www.cnblogs.com/xdp-gacl/p/4143413.html ...
- hdu4300 Clairewd’s message【next数组应用】
Clairewd’s message Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 32768/32768 K (Java/Other ...
- 队列 Queue JoinableQueue
from multiprocessing import Process, Queue def f1(q); for i in range(10): q.put(i) def f2(q): whl ...
- 主从读写分离----mysql-proxy0.8.5安装与配置
废话不多说,直接开干: 1.安装环境: yum -y install libevent glib2 lua gcc gcc-c++ autoconf mysql-devel libtool pkgco ...
- 启用hive hwi方法
hive启动hwi: ./hive --service hwi ls: cannot access /opt/cdh-5.3.6/hive-0.13.1/lib/hive-hwi-*.war: No ...
- 关于Java程序流程控制的整理(未完善)
- Hot Plug Detection, DDC, and EDID
Hot Plug Detection, DDC, and EDID DataPro Tech Info > Hot Plug Detection, DDC, and EDID Hot Plugg ...
- 剑指Offer题解(Python版)
https://blog.csdn.net/tinkle181129/article/details/79326023# 二叉树的镜像 链表中环的入口结点 删除链表中重复的结点 从尾 ...
- Qt网络模块如何使用(表格)
1.网络模块介绍 类名 说明 中文 QAbstractNetworkCache The interface for cache implementations 缓存实现的接口 QNetworkCach ...