Где выполнять асинхронные запросы React?

Question

[Deniel]

У меня есть компонент react, как мне реализовать асинхронный запрос к API(не в useEffect).
Нужно отправлять запрос при нажатии на кнопку, а затем вызвать dispatch action'a, который положит полученные данные в state(и в этом же компоненте где была нажата кнопка отрисовать данные из state)

Answer 1

[Владимир]

https://github.com/reduxjs/redux-thunk
https://redux-saga.js.org/

Answer 2

[egorovbyegorov]

<code lang="javascript">
const reactCustomComponent = (props) => {
  const data = useSelector((state) => state.data)
  const onClickBtnHandler = (event) => {
    const response = асинхронный запрос(axios || fetch)
    dispatch action'a, (response.data) || .then(res => {
    dispatch action'a, (response.data)
  })
  }
  return (
    <>
      <Button onClick={onClickBtnHandler} />
      {
        data && data
      }
    </>
  )
}
</code>

Но в иделе конечно если его нет, настроить redux-thunk и делать асинхронные запросы в actions