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

FormNode

Defined in: form/nodes/form-node.ts:51

Абстрактный базовый класс для всех узлов формы.

Все узлы (поля, группы, массивы) наследуют от этого класса и реализуют единый интерфейс для работы с состоянием и валидацией.

Template Method паттерн используется для управления состоянием: общие signals (_touched, _dirty, _status) живут в базовом классе, publi-методы (markAsTouched, disable, …) реализованы здесь, а protected hooks (onMarkAsTouched, onDisable, …) переопределяются в наследниках.

Example​

// FormNode не используется напрямую — экземпляры приходят из getReformerForm.
import { getReformerForm, FormNode } from '@reformer/core';

const form = getReformerForm({ email: '' });
form.email instanceof FormNode; // true
form.email.markAsTouched();

Extended by​

Type Parameters​

T​

T

Constructors​

Constructor​

new FormNode<T>(): FormNode<T>;

Returns​

FormNode<T>

Methods​

clearErrors()​

abstract clearErrors(): void;

Defined in: form/nodes/form-node.ts:185

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

Returns​

void

disable()​

disable(): void;

Defined in: form/nodes/form-node.ts:365

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

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

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

Returns​

void

dispose()?​

optional dispose(): void;

Defined in: form/nodes/form-node.ts:395

Очистить все ресурсы узла Должен вызываться при unmount компонента для предотвращения memory leaks

Returns​

void

Example​

// React component
useEffect(() => {
  return () => {
    form.dispose(); // Cleanup при unmount
  };
}, []);

enable()​

enable(): void;

Defined in: form/nodes/form-node.ts:376

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

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

Returns​

void

getErrors()​

getErrors(options?): ValidationError[];

Defined in: form/nodes/form-node.ts:226

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

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

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

Без параметров возвращает все ошибки (эквивалент 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_')
});

getValue()​

abstract getValue(): T;

Defined in: form/nodes/form-node.ts:141

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

Returns​

T

markAsDirty()​

markAsDirty(): void;

Defined in: form/nodes/form-node.ts:308

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

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

Returns​

void

markAsPristine()​

markAsPristine(): void;

Defined in: form/nodes/form-node.ts:319

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

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

Returns​

void

markAsTouched()​

markAsTouched(): void;

Defined in: form/nodes/form-node.ts:286

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

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

Returns​

void

markAsUntouched()​

markAsUntouched(): void;

Defined in: form/nodes/form-node.ts:297

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

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

Returns​

void

onDisable()​

protected onDisable(): void;

Defined in: form/nodes/form-node.ts:474

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

Переопределите в наследниках для дополнительной логики:

  • GroupNode: отключить все дочерние узлы
  • ArrayNode: отключить все элементы массива
  • FieldNode: очистить ошибки валидации

Returns​

void

Example​

// GroupNode
protected onDisable(): void {
  this.fields.forEach(field => field.disable());
}

onEnable()​

protected onEnable(): void;

Defined in: form/nodes/form-node.ts:486

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

Переопределите в наследниках для дополнительной логики:

  • GroupNode: включить все дочерние узлы
  • ArrayNode: включить все элементы массива
  • FieldNode: пустая реализация

Returns​

void

onMarkAsDirty()​

protected onMarkAsDirty(): void;

Defined in: form/nodes/form-node.ts:442

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

Переопределите в наследниках для дополнительной логики:

  • GroupNode: может обновить родительскую форму
  • ArrayNode: может обновить родительскую форму
  • FieldNode: пустая реализация

Returns​

void

onMarkAsPristine()​

protected onMarkAsPristine(): void;

Defined in: form/nodes/form-node.ts:454

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

Переопределите в наследниках для дополнительной логики:

  • GroupNode: пометить все дочерние узлы как pristine
  • ArrayNode: пометить все элементы массива как pristine
  • FieldNode: пустая реализация

Returns​

void

onMarkAsTouched()​

protected onMarkAsTouched(): void;

Defined in: form/nodes/form-node.ts:417

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

Переопределите в наследниках для дополнительной логики:

  • GroupNode: пометить все дочерние узлы как touched
  • ArrayNode: пометить все элементы массива как touched
  • FieldNode: пустая реализация (нет дочерних узлов)

Returns​

void

Example​

// GroupNode
protected onMarkAsTouched(): void {
  this.fields.forEach(field => field.markAsTouched());
}

onMarkAsUntouched()​

protected onMarkAsUntouched(): void;

Defined in: form/nodes/form-node.ts:430

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

Переопределите в наследниках для дополнительной логики:

  • GroupNode: пометить все дочерние узлы как untouched
  • ArrayNode: пометить все элементы массива как untouched
  • FieldNode: пустая реализация (нет дочерних узлов)

Returns​

void

patchValue()​

abstract patchValue(value): void;

Defined in: form/nodes/form-node.ts:158

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

Parameters​

value​

Partial<T>

частичное значение для обновления

Returns​

void

reset()​

abstract reset(value?): void;

Defined in: form/nodes/form-node.ts:164

Сбросить узел к начальному состоянию

Parameters​

value?​

T

опциональное новое начальное значение

Returns​

void

setErrors()​

abstract setErrors(errors): void;

Defined in: form/nodes/form-node.ts:180

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

Parameters​

errors​

ValidationError[]

массив ошибок

Returns​

void

setValue()​

abstract setValue(value, options?): void;

Defined in: form/nodes/form-node.ts:148

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

Parameters​

value​

T

новое значение

options?​

SetValueOptions

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

Returns​

void

touchAll()​

touchAll(): void;

Defined in: form/nodes/form-node.ts:349

Пометить все поля (включая вложенные) как 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);
});

validate()​

abstract validate(): Promise<boolean>;

Defined in: form/nodes/form-node.ts:174

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

Returns​

Promise<boolean>

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

Properties​

_dirty​

protected _dirty: Signal<boolean>;

Defined in: form/nodes/form-node.ts:66

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

_status​

protected _status: Signal<FieldStatus>;

Defined in: form/nodes/form-node.ts:72

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

_touched​

protected _touched: Signal<boolean>;

Defined in: form/nodes/form-node.ts:60

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

dirty​

readonly dirty: ReadonlySignal<boolean>;

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

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

disabled​

readonly disabled: ReadonlySignal<boolean>;

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

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

errors​

abstract readonly errors: ReadonlySignal<ValidationError[]>;

Defined in: form/nodes/form-node.ts:131

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

invalid​

abstract readonly invalid: ReadonlySignal<boolean>;

Defined in: form/nodes/form-node.ts:121

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

pending​

abstract readonly pending: ReadonlySignal<boolean>;

Defined in: form/nodes/form-node.ts:126

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

status​

readonly status: ReadonlySignal<FieldStatus>;

Defined in: form/nodes/form-node.ts:94

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

touched​

readonly touched: ReadonlySignal<boolean>;

Defined in: form/nodes/form-node.ts:82

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

valid​

abstract readonly valid: ReadonlySignal<boolean>;

Defined in: form/nodes/form-node.ts:116

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

value​

abstract readonly value: ReadonlySignal<T>;

Defined in: form/nodes/form-node.ts:111

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

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