Skip to main content

track()

Returns a tracked version of the given component. Any signals whose values are read while the component renders will be tracked. If any of the tracked signals change later it will cause the component to re-render.

This also wraps the component in a React.memo() call, so it will only re-render if the props change.

Example

const Counter = track(function Counter(props: CounterProps) {
const count = useAtom('count', 0)
const increment = useCallback(() => count.set(count.value + 1), [count])
return <button onClick={increment}>{count.value}</button>
})

Signature

track<T>(baseComponent: T): T extends React.MemoExoticComponent<any> ? T : React.MemoExoticComponent<T>;

Type parameters

  • T extends FunctionComponent<any, T>

Parameters

NameType
baseComponentT

Returns

T extends React.MemoExoticComponent<any> ? T : React.MemoExoticComponent<T>

Defined in: signia-react/src/track.ts:45