# Vue form to email

> Send Vue form submissions to email with FormDoc. A single-file component with fetch and a success message. No server or API needed.

Post your Vue form to FormDoc and each submission is emailed to you, with no backend of your own.

VUE

```vue
<script setup>
import { ref } from "vue";

const status = ref("");

async function onSubmit(event) {
  const form = event.target;
  status.value = "Sending…";
  const res = await fetch("https://api.formdoc.dev/v1/submit", {
    method: "POST",
    headers: { Accept: "application/json" },
    body: new FormData(form),
  });
  const result = await res.json();
  status.value = result.success ? "Thanks, message sent." : result.error.message;
  if (result.success) form.reset();
}
</script>

<template>
  <form @submit.prevent="onSubmit">
    <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY" />
    <label for="name">Name</label>
    <input id="name" type="text" name="name" required />
    <label for="email">Email</label>
    <input id="email" type="email" name="email" required />
    <label for="message">Message</label>
    <textarea id="message" name="message" required></textarea>
    <input type="checkbox" name="botcheck" style="display: none" tabindex="-1" autocomplete="off" />
    <button type="submit">Send</button>
    <p role="status">{{ status }}</p>
  </form>
</template>
```

The same component works in Nuxt. Every error code is listed in the [API reference](https://www.formdoc.dev/docs/api-reference/).