Question

我正在使用具有自动完成功能的vue组件的表单，我想让用户从建议中选择。我正在处理up，down和enter的keyup事件。不幸的是，当命中输入时，表单就会被提交。如果输入字段是重点，我想阻止表单提交。我尝试在表单标签中使用v-on：submit.prevent但是完全禁用表单提交，我需要创建一个单独的表单提交功能。

Answer 1

你可以这样做。但我真的不知道vue所以我可能错了。

window.onload = function() {
  new Vue({
    data() {
      return {
        focused: false
      }
    },
    methods: {
      onSubmit: function() {
        return this.focused;
      }
    }
  }).$mount('#app')
}

<html>

<head>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.4/vue.js"></script>
</head>

<body>
  <div id="app">
    <form v-on:submit="onSubmit">
      <input type="text" @focus="focused = true" @blur="focused = false" />
      <button :disabled="focused">Submit</button>
    </form>
  </div>

</body>

</html>

如何在关注输入时阻止表单提交，并在不使用vuejs2时启用它？

1 个答案: