Vue form to email
Post your Vue form to FormDoc and each submission is emailed to you, with no backend of your own.
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.