useDocumentEvent

El hook useDocumentEvent permite agregar y eliminar eventos del documento de forma dinámica según las propiedades especificadas.

Importación

Para importar el componente useDocumentEvent, se puede hacer desde fenextjs

import { useDocumentEvent } from "fenextjs";

Parámetros

Parámetro	Tipo	Requerido	Default	Descripcion
useDocumentEventProps	{ [key in TypeListenerKeyFunctions]?: TypeListenerFunctions<key> }	no		Objeto donde las claves son nombres de eventos del documento y los valores son funciones a ejecutar cuando el evento ocurre.

Returns

Parametro	Tipo	Descripcion
onReload	() => void	Función que elimina y vuelve a agregar los eventos, útil para actualizar los listeners en tiempo real.

Usos

Uso básico con evento 'click'

useDocumentEvent({ click: (e) => console.log("Documento clickeado:", e) });

Múltiples eventos con diferentes funciones

useDocumentEvent({
  click: (e) => console.log("Click en el documento:", e),
  keydown: (e) => console.log("Tecla presionada:", e.key),
});

Recargar listeners manualmente

const { onReload } = useDocumentEvent({
  mousemove: (e) => console.log("Movimiento del mouse:", e),
});
onReload(); // Vuelve a cargar los listeners manualmente.

useDate useJsonString