Как с помощью useEffect сделать запрос по нажатию на кнопку
Как с помощью useEffect сделать запрос по нажатию на кнопку и чтобы при повторном нажатии не делался один и тот же запрос пока не изменили состояние в инпут? Вставлял в зависимость состояние input, но всё равно сразу несколько запросов делается.
useEffect(() => { let query = () => { return ( { method: 'POST', headers: {"Content-Type": "application/json"}, body: JSON.stringify({ query: `query getLaunches($launch_year: String) { launchesPast(limit: 10, find: {launch_year: $launch_year}) { mission_name launch_date_local launch_site { site_name_long } links { flickr_images } rocket { rocket_name } id } }`, variables: { launch_year: props.inputText } }), } ) } fetch('https://api.spacex.land/graphql/', query()) .then(res => res.json()) .then(data => console.log(data.data.launchesPast)) setIsSending(props.inputText) }, [props.inputText]) |
useEffect здесь никаким боком.
Запрос надо делать в хендлере клика кнопки. Флажок о загрузке ставить и снимать либо в useState (если надо показать, что идёт загрузка), либо в ячейке useRef (если показывать не надо). Загруженные данные положить в стейт. |
А вообще лучше не увлекаться логикой в хуках. Всякую асинхронщину удобнее в моделях гонять, лучше всего мобиксовских
|
Часовой пояс GMT +3, время: 10:43. |