useStateX()

Returns a tuple similar to React.useState(). This hook will implicitly subscribe the component to the given atom. useStateX can be used with either path, atom or writable selector.

useStateX(path)

useStateX(path, options)
function useStateX<T>(
path: Path,
defaultValue: T,
options?: StateXOptions<T>,
): [T, Dispatch<T>];

useStateX(atom)

useStateX(atom, options)
function useStateX<T>(
atom: Atom<T>,
options?: StateXOptions<T>,
): [T, Dispatch<T>];

useStateX(selector)

useStateX(selector, options)
function useStateX<T>(
atom: Selector<T>,
options?: StateXOptions<T>,
): [T, Dispatch<T>];

StateXOptions

interface StateXOptions<T> {
params?: Record<string, Key>;
shouldComponentUpdate?: (
value: T,
oldValue?: T,
) => boolean;
onChange?: (props: {
value: T;
oldValue?: T;
get: StateXGetter;
set: StateXSetter;
}) => void;
}

This is the recommended hook to use when a component intends to read and write state.

shouldComponentUpdate Demo