time:2023.07.22

一、cdn

官網(wǎng)地址
<script src="https://cdn.jsdelivr.net/npm/clipboard@2.0.11/dist/clipboard.min.js"></script>

二、使用

dom

<span id="text">被復(fù)制的文字</span>
<button @click="copyLink" data-clipboard-target="#text" id="copyBtn">
復(fù)制鏈接
</abutton>

方法

// 復(fù)制鏈接
    copyLink() {
      try {
        let clipboard = new ClipboardJS('#copyBtn')
        clipboard.on('success', function (e) {
          e.clearSelection()
         alert('復(fù)制成功')
        })
        clipboard.on('error', function (e) {
          alert('復(fù)制失敗')
          console.error('clipboard error', e)
        })
        setTimeout(() => {
          clipboard.destroy();// 防止多次alert提示
        }, 0)
      } catch {
        alert('瀏覽器不支持自動復(fù)制，請手動復(fù)制或刷新重試')
        return
      }
    },