useAtoms.ts
Назначение файла
Модуль предоставляет хук useAtoms(), который читает несколько атомов как один объект и возвращает их распакованные значения.
Общая информация
useAtoms() полезен для компонентов и представлений, которые работают с несколькими состояниями одновременно, например с viewModel.state. Вместо отдельного вызова useAtom() для каждого поля хук принимает объект атомов и возвращает объект значений той же формы.
Концептуальная архитектура
Внутренне модуль:
- Нормализует
undefinedк пустому объекту. - Создает вычисляемый атом через
compute(), который читает каждое поле из переданного объекта атомов. - Использует
objectEqualsкак стратегию сравнения, чтобы не отдавать новый объект без фактического изменения значений. - Делегирует подписку и управление жизненным циклом в
useAtom().
Такой подход сохраняет единый источник реактивности и уменьшает количество ручного кода в React-компонентах.
Описание публичного API
useAtoms(): Record<string, never>
- При вызове без аргументов возвращает пустой объект.
useAtoms<TSourceAtoms>(sources: TSourceAtoms): TResult
sources: объект, где каждое поле являетсяAtom<unknown>.- Возвращает объект той же структуры, но вместо атомов содержит их текущие значения.
- Перерендеривает компонент, когда меняется хотя бы одно из наблюдаемых значений.
Примеры использования
tsx
import React from 'react';
import { atom } from '@nrgyjs/core';
import { useAtoms } from '@nrgyjs/react';
const firstName = atom('Ada');
const lastName = atom('Lovelace');
export function UserCard() {
const { firstName: first, lastName: last } = useAtoms({
firstName,
lastName,
});
return <span>{first} {last}</span>;
}