vue3 点击复制文字

在Vue3中，可以使用剪贴板API来实现点击复制文字的功能。首先，你需要在Vue组件中引入剪贴板API：

import { createApp } from 'vue'
import Clipboard from 'clipboard'

// 创建Vue应用
const app = createApp({})

// 定义复制文本的方法
app.directive('copy', {
  mounted(el, binding) {
    const clipboard = new Clipboard(el, {
      text: () => binding.value
    })
  
    clipboard.on('success', () => {
      // 复制成功的回调
      console.log('复制成功')
    })
  
    clipboard.on('error', () => {
      // 复制失败的回调
      console.log('复制失败')
    })
  }
})

// 挂载Vue应用
app.mount('#app')

然后，在你的Vue模板中，使用`v-copy`指令来绑定复制文本的值：

<template>
  <button v-copy="text">点击复制文字</button>
</template>

其中，`text`是你要复制的文字内容。

这样，当用户点击按钮时，文字内容就会被复制到剪贴板中。同时，你可以在`clipboard.on('success')`和`clipboard.on('error')`回调中处理复制成功和失败的逻辑。