vue3 ts 实现复制粘贴


<script setup lang="ts">
import { ref } from 'vue'
import { useClipboard, usePermission } from '@vueuse/core'
const input = ref('')
const { text, isSupported, copy } = useClipboard()
const permissionRead = usePermission('clipboard-read')
const permissionWrite = usePermission('clipboard-write')
script>

<template>
  <div v-if="isSupported">
    <note>
      Clipboard Permission: read <b>{{ permissionRead }}b> | write
      <b>{{ permissionWrite }}b>
    note>
    <p>
      Current copied: <code>{{ text || 'none' }}code>
    p>
    <input v-model="input" type="text">
    <button @click="copy(input)">
      Copy
    button>
  div>
  <p v-else>
    Your browser does not support Clipboard API
  p>
template>