Запретить отправку формы при нажатии ввода из текстового ввода, используя Vue.js
Я использую Vue.js в моем приложении и ввод текста в форме
<div id="myVueForm">
<form>
<input type="text" v-on="keyup:addCategory | key 'enter'">
<!-- more form fields -->
<button type="submit">Submit Form</button>
</form>
</div>
В моем экземпляре Vue у меня есть следующее
new Vue({
el: '#myVueForm',
methods: {
addCategory: function(e)
{
if(e) e.preventDefault();
console.log("Added a new category, thanks!");
}
}
});
Несмотря наpreventDefault();
вызов, когда пользователь нажимает ввод во время ввода текста, форма все еще отправляет (хотяaddCategory()
метод стреляет). Такое поведение может быть продемонстрировано вэта скрипка.
Я знаю, что могу использовать jQuery, чтобы перехватить событие и предотвратить отправку, но я хотел бы посмотреть, возможно ли это сделать в Vue, так как это довольно распространенное использование.