Vue.js -How can I submit a form with the Enter key?
The @submit
event should be added to the form element:
<form @submit.prevent="printToConsole"> <input ref="input" class="terminal-input" autofocus v-model="message"/> </form>
Vue.config.devtools = false;Vue.config.productionTip = false;new Vue({ el: '#app', data() { return { message: '' } }, methods: { printToConsole() { console.log(this.message) } }})
<link type="text/css" rel="stylesheet" href="//unpkg.com/bootstrap/dist/css/bootstrap.min.css" /><script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.js"></script><div id="app" class="container"> <form @submit.prevent="printToConsole"> <input ref="input" class="terminal-input" autofocus v-model="message" /> </form></div>