用于防止页面内容被复制、剪切或通过右键菜单操作。它接受三个可配置参数:disableCopy(禁用复制,默认true)、disableCut(禁用剪切,默认true)和 disableContextMenu(禁用右键菜单,默认true)。通过监听 copycut 和 contextmenu 事件并阻止默认行为来实现防复制功能,并在组件卸载时自动移除事件监听器。该Hook使用 useEffect 管理事件监听器的生命周期,确保只有在配置参数变化时才重新添加/移除监听器。

 useAntiCopy - 用于在页面中禁用复制、剪切和右键菜单行为的 Hook。

  •  param options 配置项:
  •     disableCopy:是否禁用复制操作(默认 true)
  •     disableCut:是否禁用剪切操作(默认 true)
  •     disableContextMenu:是否禁用右键菜单(默认 true)
import { useEffect } from 'react';/*** useAntiCopy - 用于在页面中禁用复制、剪切和右键菜单行为的 Hook。** @param options 配置项:*  - disableCopy:是否禁用复制操作(默认 true)*  - disableCut:是否禁用剪切操作(默认 true)*  - disableContextMenu:是否禁用右键菜单(默认 true)*/
interface UseAntiCopyOptions {disableCopy?: boolean;disableCut?: boolean;disableContextMenu?: boolean;
}export const useAntiCopy = (props: UseAntiCopyOptions = {}) => {const { disableCopy, disableCut, disableContextMenu } = props;// 处理复制事件const handleCopy = (e: ClipboardEvent) => {if (disableCopy) {e.preventDefault(); // 阻止默认的复制行为}};// 处理剪切事件const handleCut = (e: ClipboardEvent) => {if (disableCut) {e.preventDefault(); // 阻止默认的剪切行为}};// 处理右键菜单事件const handleContextMenu = (e: MouseEvent) => {if (disableContextMenu) {e.preventDefault(); // 阻止右键菜单弹出}};// 使用 useEffect 管理事件监听器的生命周期useEffect(() => {// 添加事件监听器if (disableCopy) {document.addEventListener('copy', handleCopy);}if (disableCut) {document.addEventListener('cut', handleCut);}if (disableContextMenu) {document.addEventListener('contextmenu', handleContextMenu);}// 组件卸载或 disableCopy 为 false 时移除监听return () => {if (disableCopy) {document.removeEventListener('copy', handleCopy);}if (disableCut) {document.removeEventListener('cut', handleCut);}if (disableContextMenu) {document.removeEventListener('contextmenu', handleContextMenu);}};}, [disableCopy, disableCut, disableContextMenu]); // 依赖数组确保只有在参数变化时才重新添加/移除监听器
};

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.pswp.cn/news/915737.shtml
繁体地址,请注明出处:http://hk.pswp.cn/news/915737.shtml
英文地址,请注明出处:http://en.pswp.cn/news/915737.shtml

如若内容造成侵权/违法违规/事实不符,请联系英文站点网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

InfluxDB HTTP API 接口调用详解(一)

引言 ** 在当今数字化时代,时间序列数据无处不在,从物联网设备产生的传感器数据,到金融领域的交易记录,再到系统运维中的监控指标,这些数据蕴含着丰富的信息,对于企业的决策制定、业务优化以及问题排查等…

使用JMeter进行压力测试(以黑马点评为例、详细图解)

目录 一、前言 二、使用JMeter进行压力测试 一、前言 本博客主要记录如何使用JMeter进行压力测试,以黑马点评P44利用互斥锁解决缓存击穿问题课程为例。至于如何完成JMeter的安装配置及创建桌面快捷方式可以看我的另一篇博客,链接如下: 压测…

旧手机部署轻量级服务器

将旧手机改造为Linux系统设备,不仅能赋予闲置设备新生,还能作为轻量级服务器、开发环境或学习平台使用。以下是三种主流方案,涵盖不同技术需求和安全等级,附操作步骤与避坑指南: ⚙️ 一、三种安装方案对比与选择 方法…

micro avg、macro avg 和 weighted avg 的区别

问题描述: 在多分类任务的评估报告中,经常看到 micro avg、macro avg 和 weighted avg 三种平均指标,请解释它们的区别以及各自的适用场景。🎯 参考答案: 这三种平均指标是用来评估多分类模型性能的不同方式&#xff0…

Kafka灰度方案

一、kafka灰度方案架构设计方案:1、外部生产-内部消费场景:(外部生产-内部消费)解决方案:先通过kdis分流服务---消费外部生产的消息,然后根据管理后台-灰度配置mcs-mimp-core应用默认的环境版本&#xff0c…

深入详解K近邻算法(KNN)在脑部疾病诊断中的应用与实现

🧑 博主简介:CSDN博客专家、CSDN平台优质创作者,高级开发工程师,数学专业,10年以上C/C++, C#,Java等多种编程语言开发经验,拥有高级工程师证书;擅长C/C++、C#等开发语言,熟悉Java常用开发技术,能熟练应用常用数据库SQL server,Oracle,mysql,postgresql等进行开发应用…

黑马点评练习题-给店铺类型查询业务添加缓存(String和List实现)

目录 一、前言 二、需求 三、String实现 四、List实现 一、前言 这是黑马点评实战篇-商户查询缓存-0.3缓存练习题分析,练习给店铺类型查询业务添加缓存。这里我自己是通过String实现的,当然在网上查询也能够找到其他的实现方式。String实现我会展示自…

深度学习 pytorch图像分类(详细版)

目录 一、项目简介 二、模型训练验证保存 三、模型测试保存csv文件 四、单张图片预测 五、模型评估 六、ONNX导出 七、ONNX推理 八、网络结构与数据增强可视化 上篇我介绍了具体步骤,今天就以我实际开发的一个具体项目来讲: 一、项目简介 苯人的…

《AR眼镜上声学的应用与挑战》

《2025GAS声学大讲堂—音频产业创新技术公益讲座》智能眼镜专题讲座第3讲将于7月24日周四19点开讲,本次邀请了 珠海莫界科技有限公司 高级算法工程师 胡立天 演讲,讲座主题:《AR眼镜上声学的应用与挑战》(点击观看直播&#xff09…

编译支持cuda硬件加速的ffmpeg

本来以为很简单,因为印象中自己在windows机器上使用过。 目前的实在一个docker环境下的ubuntu系统里。 官方操作文档 按照官方操作文档Using FFmpeg with NVIDIA GPU Hardware Acceleration - NVIDIA Docs的描述,步骤很简单: 1、安装nv-c…

在资源受限单片机中使用printf等可变参函数时的陷阱(2025年7月22日)

今天分享一个我最近在项目调试中遇到的“大坑”,这个坑来自一个我们既熟悉又依赖的朋友——printf函数。故事的主角,是一颗资源极其有限的STM32F030单片机,它只有区区4KB的RAM。 一切始于便利 项目初期,为了能方便地监控程序运行状…

大数据之Hive:Hive中week相关的几个函数

目录1.dayofweek函数2.weekday函数3.weekofyear函数1.dayofweek函数 功能:统计某天为星期几 dayofweek(date) - Returns the day of the week for date/timestamp (1 Sunday, 2 Monday, ..., 7 Saturday).dayofweek返回值为:1-7,1 星期…

基于深度学习Transform的steam游戏特征分析与可视化【词云-情感词典分析-主题分析-词频分析-关联分析】

文章目录有需要本项目的代码或文档以及全部资源,或者部署调试可以私信博主一、项目背景与研究意义二、研究目标三、研究方法与实施流程第一阶段:数据采集与预处理第二阶段:多维度数据分析第三阶段:综合分析与策略建议输出四、预期…

Qwen3-8B 与 ChatGPT-4o Mini 的 TTFT 性能对比与底层原理详解

一、模型概述与上下文支持能力 1.1 Qwen3-8B 的技术特点 Qwen3-8B 是通义实验室推出的 80 亿参数大语言模型,支持 32,768 token 的上下文长度 。其核心优化点包括: FP8 量化技术:通过将权重从 32-bit 压缩至 8-bit,显著降低显存…

recvmsg函数的用法

recvmsg 是 Linux 网络编程中用于接收消息的高级系统调用&#xff0c;支持复杂数据结构和辅助数据的接收&#xff0c;适用于 TCP/UDP/UNIX 域套接字等场景‌。以下是其核心用法详解&#xff1a;‌1. 函数原型与参数‌#include <sys/socket.h> ssize_t recvmsg(int sockfd…

24GSPS高速DA FMC子卡

单通道 16bit 12GSPS/ 12bit 15.5GSPS/ 8bit 24GSPS双通道 16bit 6.2GSPS/ 12bit 7.75GSPS/ 8bit 12GS/sDAC FMC子卡基于TI公司的高速DAC数模转换器DAC39RF12ACK和时钟芯片LMX2594而设计的标准单槽位的FMC子卡。支持单通道模式或双通道模式&#xff0c;单通道模式下提供16bit 1…

LabVIEW动态调用VI

该组LabVIEW程序演示4 种动态调用 VI 的实现方案&#xff0c;围绕 HTTP GET 任务&#xff08;通过 URL 抓取数据&#xff09;&#xff0c;利用不同调用逻辑&#xff0c;适配多场景下的并行 / 串行执行需求&#xff0c;助力工程师灵活构建异步、并行化程序。各方案说明&#xff…

安装单机版本Redis

部署操作:步骤一: 安装Redis服务# 安装redis操作 dnf install redis -y步骤二&#xff1a; 修改Redis相关配置vim /etc/redis/redis.conf # 83行附件&#xff0c; 修改为 * -::* 任意的服务都可以连接redis服务 bind * -::*#908行附近&#xff1a; 打开requirepass&#xff…

Java(Set接口和HashSet的分析)

Set 接口基本介绍:注意:取出的顺序的顺序虽然不是添加的顺序&#xff0c;但是他的固定set接口的常用方法:和 List 接口一样, Set 接口也是 Collection 的子接口&#xff0c;因此&#xff0c;常用方法和 Collection 接口一样.set的遍历方式:HashSet的全面说明:HashSet的畅通方法…

vscode不识别vsix结尾的插件怎么解决?

当VS Code无法识别.vsix文件时&#xff0c;可能是由于文件损坏、版本不兼容或安装流程不正确导致的。以下是解决此问题的详细步骤&#xff1a; 1. 确认文件完整性 重新下载.vsix文件&#xff1a;删除现有文件&#xff0c;从可靠来源重新下载&#xff0c;确保下载过程未中断。检…