Unable to Submit Forms with Vue3 and Netlify

I’ve looked at a few other posts and they are similar but I still cannot get mine to work. I have three other sites with forms on netlify I did in react/Gatsby and they work. This one is Vue3 and I get a 404 error after form submission. I don’t see the form submitted on my netlify dashboard.
The error is a 404: Page Not Found and its the same page as the contact page.

added a _redirect page to public folder which handled the site redirect breaking.

Tried: changed axios to fetch. Also used a raw netlify form without any ajax call. post URL changed to “/” as well.


    class="flex flex-wrap w-full"

form handler:

const handleSubmit = async (e: Event) => {
  error.value = false;
  const axiosConfig: AxiosRequestConfig = {
    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },

  error.value = false;
  await axios
        'form-name': e.target.getAttribute('name'),
    .then((response) => {
      if (!error.value) doToast();
    .catch((e: Error) => {
      error.value = true;

 * @param data
 * encode the query params
const encode = (data: FormInterface) => {
  const formData = new FormData();

  for (const key of Object.keys(data)) {
    formData.append(key, data[key as keyof FormInterface]);

  return formData;

Hi, it would be helpful if you shared your repo? Did you also check out the guide below?

Also can you specify more about the issue you are experiencing? I was able to submit a submission in the form.

1 Like

Hey SamO thank you. I thought this question didn’t go through so I made another one earlier. Yes I created a static form in my public folder and it worked! NOTE: make sure not to name that html page the same as the contact page or else on refresh it will error out)


1 Like

Hi @coreysmaller thanks so much for chiming in and sharing this with the community! (: