useEvent
A stable callback that always runs its handler untracked.
A stable callback that always runs its handler untracked. The ShadowJS form of React's
useEffectEvent: components run once and props are getters, so the handler already sees the
latest values. What it adds is the untracked call: an effect that calls the event does not
subscribe to the signals the handler reads.
Import#
ts
import { useEvent } from "@shadow-js/core";
Signature#
ts
function useEvent<A extends unknown[], R>(handler: (...args: A) => R): (...args: A) => R
Parameters#
| Name | Description |
|---|---|
handler |
The handler. Its arguments and result are passed through. |
Returns#
A new function with the same signature that calls handler untracked. Create it once,
in the component body, and keep the reference.
Examples#
ts
import { useEffect, useEvent, useSignal } from "@shadow-js/core";
function Ticker() {
const [count] = useSignal(0);
const onTick = useEvent(() => console.log(count())); // count() is not tracked by the effect
useEffect(() => {
const id = setInterval(() => onTick(), 1000);
return () => clearInterval(id);
});
return null;
}