Where to execute React asynchronous requests?

Question

React

I have a react component, how do I implement an asynchronous request to the API (not in useEffect).
You need to send a request when the button is pressed, and then call the dispatch action'a, which will put the received data in the state (and in the same component where the button was pressed, draw the data from the state)

Answer 1

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

Answer 2

<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>

But ideally, of course, if it is not there, set up redux-thunk and make asynchronous requests in actions