useEvent

Permite crear un callback que despacha un evento desde el web-component

Syntax

let eventInit = {
bubbles : true,
composed : true,
};
let dispatchMyEvent = useEvent("myEvent",eventInit)

Where:

  • "myEvent": String required, name of the event to be dispatched by the callback.

  • eventInit: Optional object, allows you to define the behavior of the event using the native eventInit api.

  • dispatchMyEvent: Function, it executes the event created by useEvent, it receives an optional parameter that defines the detail property of the event.

The callback generated by useEvent is immutable, so it can be used as an argument for other hooks, eg:

let dispatchMounted = useEvent("mounted",{bubbles:true,composed:true});
useEffect(dispatchMounted, []);

The previous example would allow a global listener like this:

window.addEventListener("mounted",({target})=>{
console.log("web-component mounted",target)
})

Unlike the event dispatched by the props, this does not synchronize with the cycle of rendered, so you must use useEffect if you are looking for the reading of the sun associated with the change.