前端点击按钮触发复制文本

ops/2024/10/8 6:50:33/

1. 效果展示:

点击复制小图标进行内容的复制
在这里插入图片描述


在这里我们先不考虑适用插件的情况,因为如果只是简单的复制,则不需要插件

2. 绑定事件

这里我们以vue为例子, 原生和react我后面补上

<i slot="prefix" class="iconfont icon-fuzhi theme" @click="copy"></i>
const copy = async () => {try {await navigator.clipboard.writeText('需要复制的内容')console.log('复制成功')} catch(err) {console.log('复制失败', err)}
}

是不是很简单!!!

给个三连关注一下吧


http://www.ppmy.cn/ops/14107.html

相关文章

分布式版本控制工具 Git 的使用方式

文章目录 Git简介下载安装基本使用起始配置Git 的三个区域基本操作流程查看仓库状态删除&#xff08;撤销暂存区&#xff09;差异对比查看版本日志版本回退修改提交日志分支概念&#xff1a;创建分支与切换分支合并分支&#xff08;快速合并&#xff09;合并分支&#xff08;提…

TCP断开连接为什么需要4次挥手?

一、断开连接过程 由于TCP连接是全双工的&#xff0c;因此每个方向都必须单独关闭。客户端在数据发送完毕后发送一个结束数据段FIN&#xff0c;且服务端也返回确认数据段ACK&#xff0c;此时结束了客户端到服务端的连接&#xff1b;然后客户端接收到服务端发送的FIN&#xff0c…

谷歌发布基于声学建模的无限虚拟房间增强现实鲁棒语音识别技术

声学室模拟允许在AR眼镜上以最少的真实数据进行训练&#xff0c;用于开发鲁棒的语音识别声音分离模型。 随着增强现实&#xff08;AR&#xff09;技术的强大和广泛应用&#xff0c;它能应用到各种日常情境中。我们对AR技术的潜能感到兴奋&#xff0c;并持续不断地开发和测试新…

深度学习基础:循环神经网络中的长期依赖问题

循环神经网络中的长期依赖问题 在深度学习中&#xff0c;循环神经网络&#xff08;RNN&#xff09;是一种经典的模型&#xff0c;用于处理序列数据&#xff0c;如自然语言处理、时间序列预测等任务。然而&#xff0c;传统的RNN存在着一个长期依赖问题&#xff0c;即在处理长序…

Hadoop - 安装

文章目录 关于 Hadoop架构变迁 1.0 --> 2.0 --> 3.0 安装配置安装配置环境变量配置core-site.xmlhdfs-site.xmlmapped-site.xmlyarn-site.xml配置 hadoop-env 启动/停止 Hadoop 服务查看 hdfs report 关于 Hadoop The Apache™ Hadoop project develops open-source soft…

【OpcUA开发笔记 3】Open62541证书登录方式

前言: OpcUA的登录方式有3种,分别是匿名,用户名+密码,证书。其中前两个比较简单,我们就从最复杂的说起,前两个顺带说下也就会了,属于抛砖引玉讲述解决思路,非保姆式教程。 材料:open62541-1.4.0,cmake 3.29.2,openssl 3.3.0.9,visual studio2022,python3.8.6 一、…

云原生Service Mesh服务网格简单介绍

serviceMesh是什么 Service Mesh是一个用于处理服务间通信的基础设施层&#xff0c;旨在实现云原生应用复杂服务拓扑中的可靠请求传递。其基本构成是一组与应用一起部署的轻量级网络代理&#xff0c;这些代理对应用来说是透明的。Service Mesh通过统一的方式来控制和处理服务间…

常用的Git和Linux命令

Git命令&#xff1a; Git是一个分布式版本控制系统&#xff0c;它可以帮助开发者跟踪和管理代码的变化。 git init&#xff1a;初始化一个Git仓库 git clone&#xff1a;克隆一个已有的Git仓库到本地 git add&#xff1a;将当前目录下的修改添加到暂存区 git commit&#xff1…