redux 비동기 요청 관련해 질문 하고 싶습니다.redux-saga, axios

JavaScript
1

제목과 같이 redux비동기 처리 관련해 의문이 드는게 있습니다.

redux를 사용하면서 비동기 처리를 한다. 라고 하면 다들 thunk나 saga 를 말씀하시는데

react와 같이 axios를 사용해 다음과 같이
컴포넌트에 다음과 같이

const handleChange = async (e) => {
    await axios
      .get("http://localhost:5000/realstate/pick")
      .then(({ data }) => {
        setResultList(data);	//redux dispatch
      });
  };

이런식으로 작성해서 redux에 dispatch보내주면 정상작동 되는데 이렇게 작성하면 안되는 이유가 뭔가요?

이런식으로 하면 flex , MVC패턴이 무너진다고 하시면 , dispatch 하고 Action 에 axios를 사용해 비동기 처리를 해줘도 되지 않나요? 정말 궁금합니다… 고수님들 도와주세요,

왜 저렇게 사용하면 안되는지 궁금합니다.

2

저는 딱히 의문점을 갖지않고 그냥 가이드? 대로 redux middleware을 써왔었는데,
말씀하신거처럼 작동하는대에는 아무런 문제가 없을것이라 예상됩니다.
근데 redux middleware를 썻을때 장점은 분명한것 같습니다
그냥 대충 생각해봤을때 떠오르는점들은

  1. 관심사 분리
  2. 중복코드 제거
  3. 재사용성 용이
  4. 졍형화 된 패턴으로 유지보수 및 협업 용이