Как валидировать вложенные объекты используя effector-forms?

Чтобы валидировать вложенные объекты используя effector-forms в JavaScript, нужно выполнить несколько шагов.

1. Установите effector и effector-forms:

npm install effector effector-forms

2. Импортируйте необходимые модули:

import { createEffect } from 'effector';
import { Form, Field } from 'effector-forms';

3. Определите схему валидации для вложенных объектов:

const nestedSchema = {
  email: {
    required: true,
    email: true,
  },
  password: {
    required: true,
    minLength: 8,
  },
};

4. Создайте эффект для проверки валидности объекта:

const validateNested = createEffect((values) => {
  const errors = {};

  Object.keys(nestedSchema).forEach((key) => {
    const fieldSchema = nestedSchema[key];
    const fieldValue = values[key];

    // Проверка наличия значения
    if (fieldSchema.required && !fieldValue) {
      errors[key] = 'Обязательное поле';
    }

    // Проверка формата email
    if (fieldSchema.email && fieldValue && !validateEmail(fieldValue)) {
      errors[key] = 'Некорректный email';
    }

    // Проверка длины пароля
    if (fieldSchema.minLength && fieldValue && fieldValue.length < fieldSchema.minLength) {
      errors[key] = `Минимальная длина пароля ${fieldSchema.minLength} символов`;
    }
  });

  return errors;
});

5. Создайте форму с вложенными объектами:

const form = new Form({
  nested: {
    email: new Field(''),
    password: new Field(''),
  },
});

6. Свяжите форму с эффектом валидации:

form.$values.on(validateNested.doneData, (values, errors) => {
  form.$errors.nested.set(errors);
});

7. Используйте форму в компоненте:

function NestedForm() {
  const formData = form.$values.nested;

  return (
    <div>
      <input type="email" {...formData.email} />
      {formData.email.error && <span>{formData.email.error}</span>}
      <br />
      <input type="password" {...formData.password} />
      {formData.password.error && <span>{formData.password.error}</span>}
    </div>
  );
}

Теперь при изменении значений полей внутри формы, эффект validateNested будет вызываться для проверки валидации вложенных объектов. Ошибки будут отображаться под соответствующими полями формы.

Конечно, здесь представлены лишь основы использования effector-forms для валидации вложенных объектов в JavaScript. Вы можете настроить дополнительные правила валидации, добавить обработку других типов полей и дополнительные сообщения об ошибках в зависимости от требований вашего проекта.