react • tldraw Docs

Starts a new effect scheduler, scheduling the effect immediately.

Returns a function that can be called to stop the scheduler.

function react(
  name: string,
  fn: (lastReactedEpoch: number) => any,
  options?: EffectSchedulerOptions,
): () => void;

Example

const color = atom("color", "red");
const stop = react("set style", () => {
  divElem.style.color = color.get();
});
color.set("blue");
// divElem.style.color === 'blue'
stop();
color.set("green");
// divElem.style.color === 'blue'

Also useful in React applications for running effects outside of the render cycle.

useEffect(
  () =>
    react("set style", () => {
      divRef.current.style.color = color.get();
    }),
  [],
);

Parameters

Name	Description
`name`	`string;`
`fn`	`(lastReactedEpoch: number) => any;`
`options`	`EffectSchedulerOptions;`

Returns

() => void;