复制方法是开发中经常会用到的，在实现最近一个需求的时候发现了差异，常用的复制方法对不可复制内容无效，最终实现了功能，在此列出方法，记录一下

常用可粘贴内容的复制方法：

 copyHandle(name, data) { // 复制短链接const text = this.$refs[`${name}`]text.value = datatext.select()document.execCommand('copy')this.$message({message: '复制成功！',type: 'success'})},

试了navigator.clipboard方法也可实现，但navigator对象不同页面包含的对象有差异，所以不是很推荐

 navigator.clipboard.writeText(data).then(() => {this.$message({message: '复制成功！',type: 'success'})})

不可复制内容复制
方法一：创建一个隐藏可编辑内容实现（较为笨拙）

function copyTextToClipboard(text) {// 创建一个临时的输入框const textArea = document.createElement("textarea");// 隐藏输入框textArea.style.position = "fixed";textArea.style.top = "0";textArea.style.left = "0";textArea.style.width = "2em";textArea.style.height = "2em";textArea.style.padding = "0";textArea.style.border = "none";textArea.style.outline = "none";textArea.style.boxShadow = "none";textArea.style.background = "transparent";// 设置输入框内容textArea.value = text;// 将输入框添加到页面document.body.appendChild(textArea);// 选中输入框内容textArea.select();textArea.setSelectionRange(0, text.length);// 执行复制命令let successful = false;try {successful = document.execCommand('copy');} catch (err) {console.error('Oops, unable to copy', err);}// 移除输入框document.body.removeChild(textArea);return successful;
}// 使用示例
const textToCopy = "Hello, world!";
copyTextToClipboard(textToCopy);

方法二： 使用clipboard.js

  <el-button type="primary" size="mini" class="tag" @click="copyHandle(info.text)">复制链接</el-button>import Clipboard from 'clipboard'copyHandle (data) {let clipboard = new Clipboard('.tag', {text: function () {return data}})clipboard.on('success', e => {this.$message({message: '复制成功', showClose: true, type: 'success'})// 释放内存clipboard.destroy()})clipboard.on('error', e => {this.$message({message: '复制失败,', showClose: true, type: 'error'})clipboard.destroy()})},