在 React 中实现全局防复制hooks

用于防止页面内容被复制、剪切或通过右键菜单操作。它接受三个可配置参数：disableCopy（禁用复制，默认true）、disableCut（禁用剪切，默认true）和 disableContextMenu（禁用右键菜单，默认true）。通过监听 copy、cut 和 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]); // 依赖数组确保只有在参数变化时才重新添加/移除监听器
};