Vue.js：有没有办法在项目的所有形式上都有@submit.prevent？

【问题标题】：Vue.js: Is there a way to have @submit.prevent on all the forms of a project?Vue.js：有没有办法在项目的所有形式上都有@submit.prevent？
【发布时间】：2020-04-24 08:57:21
【问题描述】：

我意识到我每次都在重复一些 sn-ps，但有时我会忘记。

其中之一是@submit.prevent。在所有表单中我必须编写它以防止提交，我将始终通过 vue 方法管理提交。

那么我可以做一些所有表单都隐含这个指令的事情吗？

【问题讨论】：

标签： forms vue.js form-submit preventdefault

【解决方案1】：

您可以创建一个简单的（可能是功能性的）组件并使用它来代替普通的<form>。

// BaseForm.vue

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

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

您不会真正节省大量代码，但您不必再考虑它了。您也可以在此处包含基本的<button type=submit></button>。

【讨论】：