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

Question

我正在使用具有自动完成功能的vue组件处理表单，我想让用户从建议中进行选择。 我正在处理向上，向下和进入的键盘输入事件。 不幸的是，当按下回车键时，将提交表单。 如果输入字段集中，我想防止表单提交。 我已经尝试在form标签中使用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 个解决方案

解决方案1
0 已采纳 2017-07-10 09:58:10

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

问题描述

1 个解决方案

解决方案1 0 已采纳 2017-07-10 09:58:10

解决方案1
0 已采纳 2017-07-10 09:58:10