Как понять, куда данные с формы будут отправлены в React
Что проверяют
Умеете ли вы проследить путь данных от полей до сервера в чужом коде и понимаете ли, где в React заканчивается браузерное поведение формы. Следом часто спрашивают про React 19: что происходит, если передать в action функцию, и чем это отличается от onSubmit.
Как отвечать
Смотрите в три места по порядку:
- атрибуты
actionиmethodу<form>: если там строка, аonSubmitне вызываетe.preventDefault(), сработает обычная браузерная отправка с перезагрузкой. Безactionформа уйдёт на текущий URL, безmethodметодом GET. У кнопки может быть свойformAction, он перекрывает атрибут формы; - обработчик
onSubmit: классический путь. Внутри ищитеfetch,axios, мутацию TanStack Query или RTK Query, либо функцию слоя API вродеapi.createOrder. Адрес собирается из базового URL (часто изimport.meta.envилиprocess.env) и пути, поэтому загляните в конфиг клиента и в прокси dev-сервера; - функция в
action: с React 19 можно написать<form action={saveOrder}>. React сам перехватывает отправку и вызывает функцию сFormData, статус даютuseFormStatusиuseActionState. Куда пойдут данные, решает функция. Если в Next.js она помечена"use server", это Server Action: браузер отправит POST на текущий маршрут, и сервер выполнит действие по его идентификатору.
Если по коду не разобраться, откройте DevTools, вкладку Network, отправьте форму и посмотрите URL, метод, Content-Type и тело. application/json значит, что данные собраны вручную, а multipart/form-data или application/x-www-form-urlencoded говорят о нативной отправке или о передаче FormData.
React Hook Form сам ничего не отправляет: handleSubmit собирает и валидирует значения и передаёт их в ваш колбэк.
Где спотыкаются
Думают, что React отправляет форму сам. Без функции в action и без preventDefault отработает браузер, и страница перезагрузится.
Ищут адрес только в компоненте. Он часто спрятан в сервисном слое, интерсепторе axios или прокси, который переписывает /api на другой хост.
Забывают, что кнопка без type внутри формы по умолчанию type="submit", и клик по «Отмене» неожиданно отправляет данные.