vue —— 调用浏览器复制方法

最新推荐文章于 2024-06-27 10:51:27 发布

Juliet_xmj

最新推荐文章于 2024-06-27 10:51:27 发布

阅读量580

点赞数

分类专栏：插件及UI框架开发问题解决 vue 文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/juliet_xmj/article/details/120951902

版权

vue 同时被 2 个专栏收录

23 篇文章 0 订阅

订阅专栏

插件及UI框架开发问题解决

14 篇文章 0 订阅

订阅专栏

本文介绍了如何在 Vue 中利用 JavaScript 原生方法实现文本复制功能。通过创建输入元素，设置其值，选中内容，然后执行 `document.execCommand('Copy')` 命令来复制文本。此方法适用于前端开发中的快捷复制操作，例如复制代码片段。

摘要由CSDN通过智能技术生成

vue —— 调用浏览器复制方法

原生

<el-button type="text" @click="copy(‘里面传想要复制的内容’)">复制</el-button>

// 复制 info 为传入的内容
  copy (info) {
    let createInput = document.createElement('input')
    createInput.value = info
    document.body.appendChild(createInput)
    createInput.select() // 选择对象
    document.execCommand('Copy') // 执行浏览器复制命令
    createInput.style.display = 'none'
    this.$message({ message: '复制成功', type: 'success' })
  }