javascript实现复制粘贴功能

一、使用clipboard.js插件（移动端兼容，el-tooltip不兼容）

1、clipboardjs官网(clipboardjs.com/)

2、安装clipboard.js

npm install clipboard --save

3、html部分代码如下：

<p  class="icon2 " :data-clipboard-text="detail.getTicketNumber" @click="copyText()">{{ detail.getTicketNumber }}</p>

4、js部分代码如下：

import ClipboardJS from "clipboard";
// 点击复制
function copyText() {
    var clipboard = new ClipboardJS('.icon2');
    clipboard.on('success', function (e) {
        showNotify({
            type: 'success',
            message: '复制成功',
            duration: 800
        })
        e.clearSelection();
    });

    clipboard.on('error', function (e) {
        console.error('Action:', e.action);
        console.error('Trigger:', e.trigger);
    });
}

二、原生方法（el-tooltip兼容）

// 点击复制
function copyText() {
    const clipboard = navigator.clipboard || {
        writeText: (text) => {
            const input = document.createElement('input')
            input.value = text
            document.body.appendChild(input)
            input.select()
            document.execCommand('copy')
            document.body.removeChild(input)
            this.$message.success("复制成功")
        }
      }
      if (navigator.clipboard) {
          clipboard.writeText(text).then(() => {
            this.$message.success("复制成功")
          })
      }else{
        clipboard.writeText(text)
      }
}