Sobes.tech
Middle

La respuesta de la API puede contener un error que debe mostrarse al usuario junto al campo correspondiente.

sobes.tech AI

Respuesta de la IA

Если API возвращает ошибку, относящуюся к конкретному полю формы, то для удобства пользователя нужно отобразить сообщение об ошибке рядом с этим полем.

Для этого обычно в ответе API возвращают структуру с ошибками, где ключи соответствуют именам полей, а значения — сообщениям об ошибках. Например:

{
  "errors": {
    "email": "Некорректный формат email",
    "password": "Пароль слишком короткий"
  }
}

На фронтенде при получении такого ответа можно связать ошибки с полями формы и отобразить их рядом с соответствующими элементами ввода.

Пример на React:

const [errors, setErrors] = React.useState({});

function handleSubmit() {
  api.submitForm(data).catch(response => {
    setErrors(response.errors);
  });
}

// В JSX
<input name="email" />
{errors.email && <div className="error">{errors.email}</div>}

<input name="password" type="password" />
{errors.password && <div className="error">{errors.password}</div>}

Так пользователь сразу видит, какие поля нужно исправить.