Vue. js: есть ли способ использовать @ submit.prevent во всех формах проекта?

Question

Я понимаю, что есть некоторые фрагменты, которые я повторяю каждый раз, и иногда я забываю.

Один из них - @submit.prevent. Во всех формах, которые мне нужно написать для предотвращения отправки, я всегда буду управлять отправкой с помощью метода vue.

Так могу ли я сделать что-то, что все формы имеют эту инструкцию неявно?

Answer 1

Вы можете создать простой (возможно, функциональный) компонент и использовать его вместо обычного <form>.

// BaseForm.vue

<template>
  <form @submit.prevent="onSubmit">
    <slot />
  </form>
</template>

<script>
export default {
  props: {
    onSubmit: {
      type: Function,
      required: true,
    }
  }
}
</script>

В действительности вы не сэкономите много кода, но у вас не будет думать об этом больше. Вы можете включить сюда и базис c <button type=submit></button>.