一. 点击复制链接的功能——方法一

原理：借助input 这个元素实现。后端接口返回相应的链接地址，然后将链接地址赋值给input的value值，最后通过input 元素的原生方法select() ，选中input 中的所有文本，最后调用document.execCommand('copy') 原生方法即可执行浏览器复制命令。最后再把input 元素去掉就可以了。

copyLink(val) { // 复制链接
    console.log(val, '复制链接')
    let url = val // 后台接口返回的链接地址
    let inputNode = document.createElement('input')  // 创建input
    inputNode.value = url // 赋值给 input 值
    document.body.appendChild(inputNode) // 插入进去
    inputNode.select() // input 原生方法，支持select（） ：选择input 中的所有文本
    document.execCommand('Copy') // 原生调用执行浏览器复制命令
    inputNode.className = 'oInput'
    inputNode.style.display = 'none' // 隐藏
    this.$message.success('复制成功')
},

这是之前使用的方法，但是今天访问了 MDN 发现该方法已弃用，不再推荐使用该方法。接下来介绍替代上面的新方法。

二. 点击复制链接的功能——方法二

使用BOM 中的navigator对象中的clipboard 属性。实现剪切、复制、粘贴功能。clipboard 链接直达，可以查看到更多用法哦。

// 写入文本到系统剪切板中
let url = 'https://www.baidu.com';
navigator.clipboard.writeText(url).then(() => {
   alert('复制成功');
});

// 从系统剪切板中读取文本
let div = document.querySelector('.result');
navigator.clipboard.readText().then((text) => {
   div.innerText = text;
});