useSelector() function

Home > @rimitive/react > useSelector

useSelector() function

Subscribe to a signal value using a selector function. Only re-renders when the selected value changes.

Signature:

export declare function useSelector<T, R>(signal: Reactive<T>, selector: (value: T) => R): R;

Parameters

Parameter	Type	Description
signal	Reactive<T>
selector	(value: T) => R

Returns:

R

Example 1

function UserName({ user }: { user: Readable<User> }) {
  const name = useSelector(user, u => u.name);
  return <span>{name}</span>;
}

Example 2

// Avoid unnecessary re-renders when deeply nested properties change
function TodoCount({ todos }: { todos: Readable<Todo[]> }) {
  const count = useSelector(todos, list => list.length);
  return <div>Total: {count}</div>;
}