vue3使用clipboard

<div class="content-link">
    <span id="link" class="content-link-url ellipsis">{{ userInfo?.user.referralUrl }}</span>
    <CopyIcon @click="copyUrl" class="copy-link" data-clipboard-target="#link" />
</div>
import Clipboard from 'clipboard'
import { onMounted } from 'vue'

let clipboard = null
const initClipboard = () => {
  clipboard && clipboard.destroy()
  clipboard = null
  clipboard = new Clipboard('.copy-link')
}
onMounted(() => {
  initClipboard()
})
// 复制分享链接
const copyUrl = () => {
  clipboard.on('success', function (e) {
    alert(111)
    e.clearSelection()
    initClipboard()
  })
  clipboard.on('error', function (e) {
    alert(222)
  })
}

 

posted @ 2023-01-04 17:38  生命在于折腾Up  阅读(857)  评论(0编辑  收藏  举报