Vue3 复制 copy 功能实现（vue-clipboard3）

安装 vue-clipboard3，附：vue2 复制 copy 功能实现

$ npm install --save vue-clipboard3

在 setup () {} 中使用：

<template>
  <button @click="touchCopy">复制链接</button>
</template>

<script>
import { defineComponent } from 'vue'
// 导入插件
import useClipboard from 'vue-clipboard3'

export default defineComponent({
  setup () {
    // 点击复制
    function touchCopy () {
      // 调用
      copy('拷贝内容')
    }
    // 使用插件
    const { toClipboard } = useClipboard()
    const copy = async (msg) => {
      try {
        // 复制
        await toClipboard(msg)
        // 复制成功
      } catch (e) {
        // 复制失败
      }
    }
    // 导出
    return {
      // 点击复制
      touchCopy
    }
  }
})
</script>

在 <script setup> 中使用：

<template>
  <button @click="touchCopy">复制链接</button>
</template>

<script setup>
// 导入插件
import useClipboard from 'vue-clipboard3'

// 点击复制
function touchCopy () {
  // 调用
  copy('拷贝内容')
}
// 使用插件
const { toClipboard } = useClipboard()
const copy = async (msg) => {
  try {
    // 复制
    await toClipboard(msg)
    // 复制成功
  } catch (e) {
    // 复制失败
  }
}
</script>