If you hit Enter when you focus on one of the inputs, you will notice that the page reloads again instead of calculating. This happens because we have prevented the behavior of the submit
button but not of the inputs.
To fix this, we have to use key modifiers:
<input v-model="a" @keyup.enter="calculate"> <input v-model="b" @keyup.enter="calculate">
Tip
When you have a form with a lot of inputs, buttons, and many more and you need to prevent their default submit behavior, you can modify the submit
event of the form. Example: <form @submit.prevent="calculate">
.
Finally, the Calculator is up and running.