如何防止在Vue.js中使用Enter键提交表单？

<template>
  <form @keydown.enter.prevent>
    <!-- 表单内容 -->
  </form>
</template>

// main.js
Vue.directive('prevent-enter', {
  bind: function(el) {
    el.addEventListener('keydown', function(e) {
      if (e.keyCode === 13) {
        e.preventDefault();
      }
    });
  }
});

<template>
  <form>
    <input v-prevent-enter />
    <!-- 表单内容 -->
  </form>
</template>

<template>
  <form>
    <input @keydown="handleKeyDown" />
    <!-- 表单内容 -->
  </form>
</template>

<script>
export default {
  methods: {
    handleKeyDown(event) {
      if (event.keyCode === 13) {
        event.preventDefault();
      }
    }
  }
}
</script>