redux-thunk react-router-dom v6

react router dom v6에서는 미들웨어 단에서 따로 처리하지 않아도 되고,

Router가 아니라 BrowserRouter로 앱을 감싸주면 됩니다.

그러고 나서 dispatch 할 때 useNavigate로 얻은 클로저를 같이 보내주면 됩니다.

applyMiddleware(ReduxThunk)
...
<React.StrictMode>
  <Router>
    <Provider store={store}>
      <App />
    </Provider>
  </Router>
</React.StrictMode>

...

return (
    <>
      <button onClick={() => dispatch(goToHome(navigate))}>Go to home</button>
      <Post post={data} />
    </>
  );
  
...

export const goToHome = (navigate) => (dispatch, getState) => {
  navigate('/');
};