黑豹程序员-vue3实现剪贴板复制

需求

vue中实现复制文字到剪贴板上

注意

创建ClipboardJS对象时，第一个参数绑定组件 class的名称。此时class为此名称的才能有复制功能。

方法代码

<script setup>
// npm install clipboard
  import ClipboardJS from 'clipboard'

  //复制文字到剪贴板
  const copyText = (txt)=>{
    const clipboard = new ClipboardJS('.copy-bind', {
      text(){
        return txt
      }
    })
    clipboard.on('success', ()=>{
      console.log('复制成功')
    })
  }

</script>

触发

<a class="copy-bind" @click="copyText('D:\\work\\java')">项目需求</a>