vue3使用clipboard

在Vue3中使用clipboard可以通过安装vue-clipboard3插件来实现，具体步骤如下：

1.安装vue-clipboard3插件

npm install vue-clipboard3 --save

2.在main.js中引入并使用插件

import { createApp } from 'vue'
import App from './App.vue'
import VueClipboard from 'vue-clipboard3'

const app = createApp(App)
app.use(VueClipboard)
app.mount('#app')

3.在组件中使用clipboard

<template>
  <div>
    <button v-clipboard:copy="text">Copy</button>
    <button v-clipboard:cut="text">Cut</button>
    <button v-clipboard:copy="text" v-clipboard:success="onCopy">Copy with callback</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      text: 'Hello World!'
    }
  },
  methods: {
    onCopy() {
      console.log('Copied!')
    }
  }
}
</script>

以上代码中，我们在按钮上使用了v-clipboard指令来实现复制和剪切功能，并且可以通过v-clipboard:success指令来添加回调函数。