Version 7.44.0-next.1

[bluebill1049]

📄 Form Component update

• added support for custom fetcher

// axios
<Form 
  action="/api" 
  method="post"
  fetcher={(action, { values }) => axios(action, values)}
/>

// SWR, Tan Query
<Form 
  action="/api" 
  method="post"
  fetcher={(action, { values }) => mutation(action)}
/>

• server error no longer set custom error

Beta documenation: http://localhost:8000/api/useform/form

🗑️ remove JSX message check (#9921)

---

This discussion was created from the release Version 7.44.0-next.1.

[joaopaulomoraes]

Awesome feature! 🚀

[bluebill1049]

Awesome to hear!

[Whoistolu]

Great feature 👍🏽

[bluebill1049]

Thanks! Give it a try and let us know how it goes. <3

[mmdcoder1]

Great job keep going! 🚀

[bluebill1049]

Thanks will do 👍

[agcty]

When will this land? Would love to use this with Remix

[bluebill1049]

you can try it today, I think the API is quite stable at this stage.

https://react-hook-form.com/api/useform/form/
#9004

I will let the next version run for some more time to patch bugs or issues

[NateWritesCode]

Hello, I was not able to get this working with Remix initially but was able to get it to work by creating the FormData like so:

          <Form
            control={control}
            method="post"
            action="/foo"
            fetcher={(action, { event }) => {
              const data = new FormData(event?.target);

              submit(data, {
                action,
                method: "post",
              });
            }}
          >

Posting here in case it helps someone

[bluebill1049]

thanks for sharing.

[bluebill1049]

actually we can supply the formData, i will make it into the next release

[bluebill1049]

fetcher: (
  action: string,
  payload: {
    values?: TFieldValues;
    method: string;
    event?: React.BaseSyntheticEvent;
    formData: FormData;
    formDataJson: string;
  },
) => Promise<void> | void;

both json and formdata will be supplied

[NateWritesCode]

That's great. Thanks!