reduxreact-reduxreact-final-formfinal-form

Calling an async redux action creator on form submission


In a typical React/Redux app it's pretty common to use redux-thunk and async action creators to trigger an AJAX request and dispatch actions on start/success/failure of this request.

However, I can't find a way to integrate such a function with react-final-form. Its redux submission example is using react-redux-promise-listener which dispatches an action immediately, but does not let me call my async action creator.

It is possible to integrate react-final-form with a redux app that uses an async action creator to perform the on-submit action? I would prefer not having to move my AJAX logic into the reducers.


Solution

  • All the form library cares about is that the onSubmit function returns a Promise. If dispatching your action created with your custom action creator can return a promise (perhaps via some middleware?), that’s all that React Final Form cares about. The promise listener library is more for side-effect middlewares, like Redux Saga.