Vuetify: [Bug Report] v-form reloads the page when user press enter while editing v-text-field

[KevinNTH]

Versions and Environment

Vuetify: 1.0.19
Vue: 2.5.16
Browsers: Chrome 67.0.3396.79
OS: Linux x86_64

Steps to reproduce

Add a v-form, with one v-text-field.
Press enter while editing the input.
Page is reloaded

Expected Behavior

Trigger submit event?

Actual Behavior

Page is reloaded

Reproduction Link

https://codepen.io/KevinNTH/pen/bKroLd

Other comments

Happens only with one v-text-field in the v-form

[jacekkarczmarczyk]

Duplicate of #3032

[MystK]

@jacekkarczmarczyk I've been browsing through the closed issues and I see it is expected behavior. How do I prevent it?

EDIT: For anyone else wondering, I Googled and found the solution below.

<v-form @submit="submit" onSubmit="return false;" >

[dakshshah96]

@MystK Your solution worked for me.

@jacekkarczmarczyk Even with a button of type=submit and a @submit handler on the v-form element, my page was reloading on pressing enter. Doing onSubmit="return false;" feels kind of hacky. Any other solutions? 😃

[MystK]

@dakshshah96

I believe it’s expected behavior because this is how vanilla HTML works. I agree with you that the solution is hacky, but the problem is with the spec, not vue.

[jofftiquez]

@dakshshah96 if you want to use the type="submit" you should use @submit.prevent="submit on your form or v-form.

[flourigh]

@dakshshah96 if you want to use the type="submit" you should use @submit.prevent="submit on your form or v-form.

put only @submit.prevent