点击复制,就可以实现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中实现浏览器的复制功能的更多相关文章

  1. Vue中结合clipboard实现复制功能

    首先现在Vue中引入clipboard npm install clipboard --save 在需要使用的组件中import 引入clipboard import Clipboard from ' ...

  2. vue中npm run dev运行项目不能自动打开浏览器! 以及 webstorm跑vue项目jshint一直提示错误问题的解决方法!

    vue中npm run dev运行项目不能自动打开浏览器!以及 webstorm跑vue项目jshint一直提示错误问题的解决方法! 1.上个项目结束就很久没有使用vue了,最近打算用vue搭建自己的 ...

  3. Vue中浏览器的的前进和后退

    项目开发的时候,有时候可能需要我们来对页面后退和前进,这个东西跟浏览器自带的前进后退功能很像,下面来大致讲一下在vue中浏览器的前进和后退 一.后退功能 vue中的后退有好多种方法可以使用,使用这些方 ...

  4. vue中解决chrome浏览器自动播放音频 和MP3语音打包到线上

    一.vue中解决chrome浏览器自动播放音频 需求 有新订单的时候,页面自动语音提示和弹出提示框: 问题 chrome浏览器在18年4月起,就在桌面浏览器全面禁止了音视频的自动播放功能.严格地来说, ...

  5. Vue中comoputed中的数据绑定

    Vue中的数据实现响应式绑定是在初始化的时候利用definePrototype的定义set和get过滤器,在进行组件模板编译时实现water的监听搜集依赖项,当数据发生变化时在set中通过调用dep. ...

  6. Vue中应用CORS实现AJAX跨域,及它在 form data 和 request payload 的小坑处理

    基本概念部分(一):理解CORS 说道Vue的跨域AJAX,我想先梳理一遍CORS跨域,"跨域资源共享"(Cross-origin resource sharing),它是一个W3 ...

  7. axios在vue中的简单配置与使用

    一.axios 简介 axios 是一个基于Promise 用于浏览器和 nodejs 的 HTTP 客户端,它本身具有以下特征:https://hzzly.github.io/2017/03/12/ ...

  8. vue中引入babel步骤

    vue中引入babel步骤 vue项目中普遍使用es6语法,但有时我们的项目需要兼容低版本浏览器,这时就需要引入babel插件,将es6转成es5. 1.安装babel-polyfill插件 npm ...

  9. vue中的路由的跳转的参数

    vue中的路由跳转传参 params 与 query this.$router.push({ name:"detail", params:{ name:'nameValue', c ...

随机推荐

  1. ujquery.fancybox api开发文档中文翻译版

    2016年11月17日11:57:14 基础使用 http://fancybox.net/howto 1. 首先,请确保您使用的是有效的DOCTYPE这是FancyBox看起来和功能正确需要. 2. ...

  2. 解决ubuntu系统“XXX is not in the sudoers file”错误

    用adduser新建的用户,当时只输入了一个用户名,没做其它操作,这样就建立了一个normal用户.在执行sudo vim hadoop-env.sh时,报“*** is not in the sud ...

  3. [No0000166]CPU的组成结构及其原理

    中央处理器(Central Processing Unit, CPU) CPU的基本架构和工作原理其实百科上讲得已经相当清楚了,不过我觉得有些事情呢还是给个例子出来比较方便学习.本文会先从内存地址,计 ...

  4. [No0000DE]C# XmlHelper XML类型操作 类封装

    using System; using System.Data; using System.IO; using System.Text; using System.Threading; using S ...

  5. wpf(windos窗体)

    在windos窗体中可以放置各种控件,以及为控件定义事件等等,而窗体的显示可以通过show方法以及showdialog方法.他们的区别是 show:运行程序的时候弹出新窗体,而该新窗体会一闪而过,最小 ...

  6. [daily][CentOS][SELinux]用key免登陆不成功,原来是SElinux在搞事情

    为了提高效率,一般情况下,会把公钥放到sshd主机的 $HOME/.ssh/authorized_keys 文件内. 把私钥放在client的 $HOME/.ssh/ 下. 然后就可以免密登录了.然而 ...

  7. python摸爬滚打之day01----初识Python

    1.编程语言分类 编译型语言:程序被一次性全部翻译成机器语言,计算机直接以机器语⾔言来运⾏行行此程序. 优点:运行效率高,可脱离语言环境独立运行. 缺点:开发效率低,可移植性差. 解释型语言:将程序逐 ...

  8. 【PyQt5-Qt Designer】添加图片+鼠标点击

    添加图片+鼠标点击 graphicsView中添加图片 效果图 添加之后左边1处 生成qrc文件  选择文件右键编译-生成图片的16进制文件 课后作业:

  9. python全栈开发day10

    day10知识点总结 while循环补充: continue,终止当前循环,开始下一次循环 break,终止所有循环 pycharm 技巧1.setting 中搜索 mouse 设置鼠标滚轮 改变字体 ...

  10. 深入了解HBASE架构(转)

    dd by zhj: 最近的工作需要跟HBase打交道,所以花时间把<HBase权威指南>粗略看了一遍,感觉不过瘾,又从网上找了几篇经典文章. 下面这篇就是很经典的文章,对HBase的架构 ...