Как в Reacte js добавить полю input дополнительно список возможных адресов
Мне нужно сделать поле инпут в которое можно в водить адрес, после чего у меня отправляется запрос на яндекс апи карт и возвращается список адресов, при клики на который данные будут переданы в input и зафиксированы.
В официальной документации https://ru.react.js.org/docs/forms.html есть вариант как сделать просто список, но в поле я не могу в вести адрес, поскольку список стал фиксированный.
Ответы (1 шт):
Автор решения: jjswift
→ Ссылка
В вашем случае логика довольно проста:
- Создайте ваш input.
- Храните его value в каком либо состоянии, к примеру используя хук useState().
- Создайте функцию-обработчик, которая будет реагировать на событие onChange вашего input, изменяя состояние, созданное с помощью useState() на value, что будет получено этой функцией.
- Передайте её в атрибут onChange вашего input.
Готово. Вы создали свой управляемый компонент. Теперь вы можете использовать значение, хранимое в состоянии для ваших нужд (к примеру запросов на сервер, etc.).
Для создания сложных форм рекомендую использовать вспомогательные библиотеки, к примеру Formik.