首页 > 其他分享 >Vue3 - 实现文本复制粘贴功能

Vue3 - 实现文本复制粘贴功能

时间:2023-06-18 23:45:36浏览次数:42  
标签:const text Vue3 toClipboard 解构 复制粘贴 复制 clipboard3 文本

1.安装库并导入

npm i vue-clipboard3 --save

2.在需要的前端文件中导入

import clipboard3 from  'vue-clipboard3'

html结构如下

<template>
  <div class="hello">
    <input type="text" v-model="text">
    <button @click="copy">点击复制</button>
  </div>
</template>
3.解构api、定义methods
    const text =ref("")
    //解构出复制方法
    const { toClipboard } = clipboard3();
    const copy = async () => {
     try {
        await toClipboard(text.value);
        alert("复制text: "+text.value+' 复制成功')
     } catch (error) {
       alert("复制失败")
     }
    }

 

标签:const,text,Vue3,toClipboard,解构,复制粘贴,复制,clipboard3,文本
From: https://www.cnblogs.com/beatle-go/p/17490030.html

相关文章

  • 自然语言处理中的文本摘要:从文本到算法
    目录1.引言2.技术原理及概念3.实现步骤与流程3.1准备工作:文本预处理3.2特征提取3.3文本分类3.4摘要生成4.应用示例与代码实现讲解4.1应用场景介绍4.2应用实例分析4.3核心代码实现4.4代码讲解5.优化与改进5.1数据增强5.2正则化5.3特征选择6.结论与展望"自然语言......
  • 拆分文本文件
    #-*-coding:utf-8-*-importosimportpandasaspddefsplit_csv(src_file_name,num,flag,file_encoding):df=pd.read_csv(src_file_name,encoding='gbk')#total_num,原始文件总行数;num_tmp根据num计算出文件个数或每个文件行数total_num=df.sh......
  • 一文看完Vue3的渲染过程
    Vue3官网中有下面这样一张图,基本展现出了Vue3的渲染原理:本文会从源码角度来草率的看一下Vue3的运行全流程,旨在加深对上图的理解,从下面这个很简单的使用示例开始:import{createApp,ref}from"vue";createApp({template:`<divclass="card"><butt......
  • 怎么利用大厂的API将大段音频转成文本
    日常办公中,我们经常要开会和写会议纪要。传统模式下,我们需要非常认真地听会议中每一句话,记下自己认为的核心的话,并在会后经过多次修改形成会议纪要。现在,聪明人已经不那么干了,借助几百块的讯飞录音笔,我们可以一口气录下长达三小时的音频,讯飞还能免费给这些录音笔录制的音频转......
  • 如何过滤敏感词免费文本敏感词检测接口API
    @目录前言一、文本敏感词检测API二、使用步骤1、接口2、请求参数三、案例和demo前言敏感词过滤是随着互联网社区发展一起发展起来的一种阻止网络犯罪和网络暴力的技术手段,通过对可能存在犯罪或网络暴力可能的关键词进行有针对性的筛查和屏蔽,很多时候我们能够防患于未然,把后果严......
  • vue3+vite+web3.js报错ReferenceError: process is not defined
    在vite最新版本中使用web3会报错只需要在vite.config.ts添加如下代码即可解决报错import{fileURLToPath,URL}from'node:url'import{defineConfig}from'vite'importvuefrom'@vitejs/plugin-vue'//引入import{resolve}from'path'export......
  • java中 如何在文本中筛选出汉字
    在Java中,使用正则表达式来筛选出文本中的汉字。下面是一种方法:importjava.util.regex.Matcher;importjava.util.regex.Pattern;publicclassMain{publicstaticvoidmain(String[]args){Stringtext="Hello你好!Thisisatest文本。";//使......
  • java中 如何在文本中筛选出汉字
    在Java中,使用正则表达式来筛选出文本中的汉字。下面是一种方法:importjava.util.regex.Matcher;importjava.util.regex.Pattern;publicclassMain{publicstaticvoidmain(String[]args){Stringtext="Hello你好!Thisisatest文本。";//使......
  • java中 如何在文本中筛选出汉字
    在Java中,使用正则表达式来筛选出文本中的汉字。下面是一种方法:importjava.util.regex.Matcher;importjava.util.regex.Pattern;publicclassMain{publicstaticvoidmain(String[]args){Stringtext="Hello你好!Thisisatest文本。";/......
  • java中 如何在文本中筛选出汉字
    在Java中,使用正则表达式来筛选出文本中的汉字。下面是一种方法:importjava.util.regex.Matcher;importjava.util.regex.Pattern;publicclassMain{publicstaticvoidmain(String[]args){Stringtext="Hello你好!Thisisatest文本。";/......