Перейти к основному содержимому

ArrayNode

Defined in: core/nodes/array-node.ts:44

ArrayNode - массив форм с реактивным состоянием

Example​

const array = new ArrayNode({
  title: { value: '', component: Input },
  price: { value: 0, component: Input },
});

array.push({ title: 'Item 1', price: 100 });
array.at(0)?.title.setValue('Updated');
console.log(array.length.value); // 1

Extends​

Type Parameters​

T​

T extends FormFields

Constructors​

Constructor​

new ArrayNode<T>(schema, initialItems): ArrayNode<T>;

Defined in: core/nodes/array-node.ts:84

Parameters​

schema​

FormSchema<T>

initialItems​

Partial<T>[] = []

Returns​

ArrayNode<T>

Overrides​

FormNode.constructor

Methods​

applyBehaviorSchema()​

applyBehaviorSchema(schemaFn): void;

Defined in: core/nodes/array-node.ts:459

Применить behavior schema ко всем элементам ArrayNode

Автоматически применяется к новым элементам при push/insert.

Parameters​

schemaFn​

unknown

Behavior schema функция

Returns​

void

Example​

import { addressBehavior } from './behaviors/address-behavior';

form.addresses.applyBehaviorSchema(addressBehavior);

applyValidationSchema()​

applyValidationSchema(schemaFn): void;

Defined in: core/nodes/array-node.ts:430

Применить validation schema ко всем элементам массива

Validation schema будет применена к:

  • Всем существующим элементам
  • Всем новым элементам, добавляемым через push/insert

Parameters​

schemaFn​

unknown

Функция валидации для элемента массива

Returns​

void

Example​

import { propertyValidation } from './validation/property-validation';

form.properties.applyValidationSchema(propertyValidation);

at()​

at(index): any;

Defined in: core/nodes/array-node.ts:192

Получить элемент по индексу

Parameters​

index​

number

Индекс элемента

Returns​

any

Типизированный GroupNode или undefined если индекс вне границ

clear()​

clear(): void;

Defined in: core/nodes/array-node.ts:183

Удалить все элементы массива

Returns​

void

clearErrors()​

clearErrors(): void;

Defined in: core/nodes/array-node.ts:292

Очистить ошибки валидации

Returns​

void

Overrides​

FormNode.clearErrors

disable()​

disable(): void;

Defined in: core/nodes/form-node.ts:370

Отключить узел

Template Method: обновляет статус в базовом классе, вызывает hook для кастомной логики в наследниках

Отключенные узлы не проходят валидацию и не включаются в getValue()

Returns​

void

Inherited from​

FormNode.disable

dispose()​

dispose(): void;

Defined in: core/nodes/array-node.ts:572

Очистить все ресурсы узла Рекурсивно очищает все subscriptions и элементы массива

Returns​

void

Example​

useEffect(() => {
  return () => {
    arrayNode.dispose();
  };
}, []);

Overrides​

FormNode.dispose

enable()​

enable(): void;

Defined in: core/nodes/form-node.ts:381

Включить узел

Template Method: обновляет статус в базовом классе, вызывает hook для кастомной логики в наследниках

Returns​

void

Inherited from​

FormNode.enable

forEach()​

forEach(callback): void;

Defined in: core/nodes/array-node.ts:344

Итерировать по элементам массива

Parameters​

callback​

(item, index) => void

Функция, вызываемая для каждого элемента с типизированным GroupNode

Returns​

void

getErrors()​

getErrors(options?): ValidationError[];

Defined in: core/nodes/form-node.ts:231

Получить ошибки валидации с фильтрацией

Позволяет фильтровать ошибки по различным критериям:

  • По коду ошибки
  • По сообщению (частичное совпадение)
  • По параметрам
  • Через кастомный предикат

Без параметров возвращает все ошибки (эквивалент errors.value)

Parameters​

options?​

ErrorFilterOptions

Опции фильтрации ошибок

Returns​

ValidationError[]

Отфильтрованный массив ошибок валидации

Example​

// Все ошибки
const allErrors = form.getErrors();

// Ошибки с конкретным кодом
const requiredErrors = form.getErrors({ code: 'required' });

// Ошибки с несколькими кодами
const errors = form.getErrors({ code: ['required', 'email'] });

// Ошибки по сообщению
const passwordErrors = form.getErrors({ message: 'Password' });

// Ошибки по параметрам
const minLengthErrors = form.getErrors({
  params: { minLength: 8 }
});

// Кастомная фильтрация
const customErrors = form.getErrors({
  predicate: (err) => err.code.startsWith('custom_')
});

Inherited from​

FormNode.getErrors

getValue()​

getValue(): T[];

Defined in: core/nodes/array-node.ts:200

Получить значение узла (non-reactive) Использует .peek() для получения значения без создания зависимости

Returns​

T[]

Overrides​

FormNode.getValue

insert()​

insert(index, initialValue?): void;

Defined in: core/nodes/array-node.ts:164

Вставить элемент в массив

Parameters​

index​

number

Индекс для вставки

initialValue?​

Partial<T>

Начальные значения для нового элемента

Returns​

void

map()​

map<R>(callback): R[];

Defined in: core/nodes/array-node.ts:355

Маппинг элементов массива

Type Parameters​

R​

R

Parameters​

callback​

(item, index) => R

Функция преобразования с типизированным GroupNode

Returns​

R[]

Новый массив результатов

markAsDirty()​

markAsDirty(): void;

Defined in: core/nodes/form-node.ts:313

Отметить узел как dirty (значение изменено)

Template Method: обновляет signal в базовом классе, вызывает hook для кастомной логики в наследниках

Returns​

void

Inherited from​

FormNode.markAsDirty

markAsPristine()​

markAsPristine(): void;

Defined in: core/nodes/form-node.ts:324

Отметить узел как pristine (значение не изменено)

Template Method: обновляет signal в базовом классе, вызывает hook для кастомной логики в наследниках

Returns​

void

Inherited from​

FormNode.markAsPristine

markAsTouched()​

markAsTouched(): void;

Defined in: core/nodes/form-node.ts:291

Отметить узел как touched (пользователь взаимодействовал)

Template Method: обновляет signal в базовом классе, вызывает hook для кастомной логики в наследниках

Returns​

void

Inherited from​

FormNode.markAsTouched

markAsUntouched()​

markAsUntouched(): void;

Defined in: core/nodes/form-node.ts:302

Отметить узел как untouched

Template Method: обновляет signal в базовом классе, вызывает hook для кастомной логики в наследниках

Returns​

void

Inherited from​

FormNode.markAsUntouched

onDisable()​

protected onDisable(): void;

Defined in: core/nodes/array-node.ts:600

Hook: вызывается после disable()

Для ArrayNode: рекурсивно отключаем все элементы массива

Returns​

void

Example​

// Отключить весь массив полей
form.items.disable();

// Все элементы становятся disabled
form.items.forEach(item => {
  console.log(item.status.value); // 'disabled'
});

Overrides​

FormNode.onDisable

onEnable()​

protected onEnable(): void;

Defined in: core/nodes/array-node.ts:622

Hook: вызывается после enable()

Для ArrayNode: рекурсивно включаем все элементы массива

Returns​

void

Example​

// Включить весь массив полей
form.items.enable();

// Все элементы становятся enabled
form.items.forEach(item => {
  console.log(item.status.value); // 'valid' или 'invalid'
});

Overrides​

FormNode.onEnable

onMarkAsDirty()​

protected onMarkAsDirty(): void;

Defined in: core/nodes/array-node.ts:323

Hook: вызывается после markAsDirty()

Для ArrayNode: рекурсивно помечаем все элементы массива как dirty

Returns​

void

Overrides​

FormNode.onMarkAsDirty

onMarkAsPristine()​

protected onMarkAsPristine(): void;

Defined in: core/nodes/array-node.ts:332

Hook: вызывается после markAsPristine()

Для ArrayNode: рекурсивно помечаем все элементы массива как pristine

Returns​

void

Overrides​

FormNode.onMarkAsPristine

onMarkAsTouched()​

protected onMarkAsTouched(): void;

Defined in: core/nodes/array-node.ts:305

Hook: вызывается после markAsTouched()

Для ArrayNode: рекурсивно помечаем все элементы массива как touched

Returns​

void

Overrides​

FormNode.onMarkAsTouched

onMarkAsUntouched()​

protected onMarkAsUntouched(): void;

Defined in: core/nodes/array-node.ts:314

Hook: вызывается после markAsUntouched()

Для ArrayNode: рекурсивно помечаем все элементы массива как untouched

Returns​

void

Overrides​

FormNode.onMarkAsUntouched

patchValue()​

patchValue(values): void;

Defined in: core/nodes/array-node.ts:217

Частично обновить значение узла Для FieldNode: работает как setValue Для GroupNode: обновляет только указанные поля Для ArrayNode: обновляет только указанные элементы

Parameters​

values​

(T | undefined)[]

Returns​

void

Overrides​

FormNode.patchValue

push()​

push(initialValue?): void;

Defined in: core/nodes/array-node.ts:137

Добавить элемент в конец массива

Parameters​

initialValue?​

Partial<T>

Начальные значения для нового элемента

Returns​

void

removeAt()​

removeAt(index): void;

Defined in: core/nodes/array-node.ts:146

Удалить элемент по индексу

Parameters​

index​

number

Индекс элемента для удаления

Returns​

void

reset()​

reset(values?): void;

Defined in: core/nodes/array-node.ts:242

Сбросить массив к указанным значениям (или очистить)

Parameters​

values?​

T[]

опциональный массив значений для сброса

Returns​

void

Remarks​

Очищает текущий массив и заполняет новыми элементами

Example​

// Очистить массив
arrayNode.reset();

// Сбросить к новым значениям
arrayNode.reset([{ name: 'Item 1' }, { name: 'Item 2' }]);

Overrides​

FormNode.reset

resetToInitial()​

resetToInitial(): void;

Defined in: core/nodes/array-node.ts:277

Сбросить массив к исходным значениям (initialItems)

Returns​

void

Remarks​

Восстанавливает массив в состояние, которое было при создании ArrayNode. Более явный способ сброса к начальным значениям по сравнению с reset()

Полезно когда:

  • Пользователь нажал "Cancel" - вернуть массив к исходным элементам
  • Массив был изменен через reset(newValues), но нужно вернуться к началу
  • Явное намерение показать "отмена всех изменений"

Example​

const arrayNode = new ArrayNode(
  { name: { value: '', component: Input } },
  [{ name: 'Initial 1' }, { name: 'Initial 2' }]
);

arrayNode.push({ name: 'New Item' });
arrayNode.reset([{ name: 'Temp' }]);
console.log(arrayNode.length.value); // 1

arrayNode.resetToInitial();
console.log(arrayNode.length.value); // 2
console.log(arrayNode.at(0)?.name.value.value); // 'Initial 1'

setErrors()​

setErrors(_errors): void;

Defined in: core/nodes/array-node.ts:287

Установить ошибки валидации извне

Parameters​

_errors​

ValidationError[]

Returns​

void

Overrides​

FormNode.setErrors

setValue()​

setValue(values, options?): void;

Defined in: core/nodes/array-node.ts:204

Установить значение узла

Parameters​

values​

T[]

options?​

SetValueOptions

опции установки значения

Returns​

void

Overrides​

FormNode.setValue

touchAll()​

touchAll(): void;

Defined in: core/nodes/form-node.ts:354

Пометить все поля (включая вложенные) как touched Алиас для markAsTouched(), но более явно показывает намерение пометить ВСЕ поля рекурсивно

Полезно для:

  • Показа всех ошибок валидации перед submit
  • Принудительного отображения ошибок при нажатии "Validate All"
  • Отображения невалидных полей в wizard/step form

Returns​

void

Example​

// Показать все ошибки перед submit
form.touchAll();
const isValid = await form.validate();
if (!isValid) {
  // Все ошибки теперь видны пользователю
}

// Или использовать submit() который уже вызывает touchAll
await form.submit(async (values) => {
  await api.save(values);
});

Inherited from​

FormNode.touchAll

validate()​

validate(): Promise<boolean>;

Defined in: core/nodes/array-node.ts:282

Запустить валидацию узла

Returns​

Promise<boolean>

Promise<boolean> - true если валидация успешна

Overrides​

FormNode.validate

watchItems()​

watchItems<K>(fieldKey, callback): () => void;

Defined in: core/nodes/array-node.ts:504

Подписка на изменения конкретного поля во всех элементах массива Срабатывает при изменении значения поля в любом элементе

Type Parameters​

K​

K extends string | number | symbol

Parameters​

fieldKey​

K

Ключ поля для отслеживания

callback​

(values) => void | Promise<void>

Функция, вызываемая при изменении, получает массив всех значений и индекс измененного элемента

Returns​

Функция отписки для cleanup

(): void;
Returns​

void

Example​

// Автоматический пересчет общей стоимости при изменении цен
const dispose = form.existingLoans.watchItems(
  'remainingAmount',
  (amounts) => {
    const totalDebt = amounts.reduce((sum, amount) => sum + (amount || 0), 0);
    form.totalDebt.setValue(totalDebt);
  }
);

// При изменении любого remainingAmount → пересчитается totalDebt
form.existingLoans.at(0)?.remainingAmount.setValue(500000);

// Cleanup
useEffect(() => dispose, []);

watchLength()​

watchLength(callback): () => void;

Defined in: core/nodes/array-node.ts:548

Подписка на изменение длины массива Срабатывает при добавлении/удалении элементов

Parameters​

callback​

(length) => void | Promise<void>

Функция, вызываемая при изменении длины, получает новую длину

Returns​

Функция отписки для cleanup

(): void;
Returns​

void

Example​

// Обновление счетчика элементов в UI
const dispose = form.properties.watchLength((length) => {
  console.log(`Количество объектов недвижимости: ${length}`);
  form.propertyCount.setValue(length);
});

form.properties.push({ title: 'Квартира', value: 5000000 });
// Выведет: "Количество объектов недвижимости: 1"

// Cleanup
useEffect(() => dispose, []);

Properties​

_dirty​

protected _dirty: Signal<boolean>;

Defined in: core/nodes/form-node.ts:56

Значение узла было изменено (dirty) Protected: наследники могут читать/изменять через методы

Inherited from​

FormNode._dirty

_status​

protected _status: Signal<FieldStatus>;

Defined in: core/nodes/form-node.ts:62

Текущий статус узла Protected: наследники могут читать/изменять через методы

Inherited from​

FormNode._status

_touched​

protected _touched: Signal<boolean>;

Defined in: core/nodes/form-node.ts:50

Пользователь взаимодействовал с узлом (touched) Protected: наследники могут читать/изменять через методы

Inherited from​

FormNode._touched

dirty​

readonly dirty: ReadonlySignal<boolean>;

Defined in: core/nodes/array-node.ts:74

Значение узла было изменено (dirty) Computed из _dirty для предоставления readonly интерфейса

Overrides​

FormNode.dirty

disabled​

readonly disabled: ReadonlySignal<boolean>;

Defined in: core/nodes/form-node.ts:99

Узел отключен (disabled)

Inherited from​

FormNode.disabled

enabled​

readonly enabled: ReadonlySignal<boolean>;

Defined in: core/nodes/form-node.ts:104

Узел включен (enabled)

Inherited from​

FormNode.enabled

errors​

readonly errors: ReadonlySignal<ValidationError[]>;

Defined in: core/nodes/array-node.ts:76

Массив ошибок валидации

Overrides​

FormNode.errors

invalid​

readonly invalid: ReadonlySignal<boolean>;

Defined in: core/nodes/array-node.ts:72

Узел невалиден (есть ошибки валидации)

Overrides​

FormNode.invalid

length​

readonly length: ReadonlySignal<number>;

Defined in: core/nodes/array-node.ts:78

pending​

readonly pending: ReadonlySignal<boolean>;

Defined in: core/nodes/array-node.ts:75

Выполняется асинхронная валидация

Overrides​

FormNode.pending

pristine​

readonly pristine: ReadonlySignal<boolean>;

Defined in: core/nodes/form-node.ts:88

Значение узла не было изменено (pristine)

Inherited from​

FormNode.pristine

status​

readonly status: ReadonlySignal<FieldStatus>;

Defined in: core/nodes/array-node.ts:77

Текущий статус узла Computed из _status для предоставления readonly интерфейса

Overrides​

FormNode.status

touched​

readonly touched: ReadonlySignal<boolean>;

Defined in: core/nodes/array-node.ts:73

Пользователь взаимодействовал с узлом (touched) Computed из _touched для предоставления readonly интерфейса

Overrides​

FormNode.touched

untouched​

readonly untouched: ReadonlySignal<boolean>;

Defined in: core/nodes/form-node.ts:77

Пользователь не взаимодействовал с узлом (untouched)

Inherited from​

FormNode.untouched

valid​

readonly valid: ReadonlySignal<boolean>;

Defined in: core/nodes/array-node.ts:71

Узел валиден (все валидаторы прошли успешно)

Overrides​

FormNode.valid

value​

readonly value: ReadonlySignal<T[]>;

Defined in: core/nodes/array-node.ts:70

Текущее значение узла

  • Для FieldNode: значение поля
  • Для GroupNode: объект со значениями всех полей
  • Для ArrayNode: массив значений элементов

Overrides​

FormNode.value