Estoy trabajando en una lógica que pone la pantalla en negro cuando presiono la tecla de captura de pantalla de impresión. Cambié el color de fondo pero no funciona. La consola detectó un cambio en el valor.
¿Qué ocurre?
Yo uso mecanografiado y next.js
function App({ Component, pageProps }: AppProps) { const [value, setValue] = useState(false); useEffect(()=> { const keyUpListener = (e:KeyboardEvent) => { if (e.key === 'PrintScreen' || e.key === 'F13') { alert('test'); document.body.style.zIndex = '999999'; document.body.style.backgroundColor = 'black'; setValue(v => !v); } } document.addEventListener('keyup', keyUpListener); return () => document.removeEventListener('keyup', keyUpListener); }, []); return <> <Component {...pageProps} /> </>; }Tal vez intente cambiar el evento keyup a keydown para rastrear la pulsación de tecla antes de que se active.
También recuerde desvincular su evento para evitar pérdidas de memoria.
useEffect(() => { document.addEventListener('keydown', (e: KeyboardEvent) => { if (e.key === 'PrintScreen' || e.key === 'F13') { alert('test'); document.body.style.zIndex = '999999'; document.body.style.backgroundColor = 'black'; } }) return () => document.removeEventListener('keydown')}, [])
Debería ser algo en estos términos, aunque no lo probé.