Правильный способ использования реактивной формы с машинописным и пользовательским интерфейсом материала для отображения сообщения об ошибке - PullRequest
0 голосов
/ 14 марта 2020

Я использую форму реагирующего крючка с машинописным и материальным интерфейсом. Я хотел передать сообщение об ошибке как helperText в TextField. Я пытался сделать это, используя helperText={errors.email?.message}, но машинописный текст жалуется на это назначение.

Property 'email' does not exist on type 'NestDataObject<FormData>'.ts(2339)

Я не хочу отключать это правило из моего файла .eslintr c, поскольку оно может игнорировать другие подобные проблемы в моем приложении, которые могут быть желательны в некоторых местах. Как правильно назначить сообщение об ошибке формы реакции-хука в качестве вспомогательного текста для компонентов Material-UI?

коды и ссылки на ящики https://codesandbox.io/s/material-ui-react-form-hook-yi669

1 Ответ

2 голосов
/ 14 марта 2020

Необходимо определить тип данных для данных формы и передать его 'useForm'.

type FormData = {
  email: string;
  password: string;
};

const { control, handleSubmit, errors } = useForm<FormData>();

Обновленная песочница: https://codesandbox.io/s/material-ui-react-form-hook-answer-8cxc1

...