0Pricing
Vue Academy · Lesson

Form Submission and Reset

@submit.prevent, FormData, resetting form state, disabling submit during loading.

Handling Form Submission

A real form needs to submit data without reloading the page, manage loading state, and reset afterward. The Composition API plus a few directives make this clean.

Stop the Page Reload

By default a form submit reloads the page. The .prevent modifier on @submit calls preventDefault() so you can handle it in JavaScript.

<form @submit.prevent="onSubmit">
  <button type="submit">Send</button>
</form>

All lessons in this course

  1. v-model on All Form Elements
  2. Form Submission and Reset
  3. Manual Validation Patterns
  4. VeeValidate for Schema-Based Validation
← Back to Vue Academy