Building Applications with Spring 5 and Vue.js 2

Implement the form bindings

First of all, let's add the three fields to the data model, as follows:

export default {  name: 'RegisterPage',  data: function () {    return {      form: {        username: '',        emailAddress: '',        password: ''      }    }  }}

With this change, the first test that we just added should be able to pass now. Let's run the npm run test:unit command to verify that. In the result, you should see something like the following:

Tests:       2 failed, 3 passed, 5 total

We have made some progress here. Now, let's bind the data model to the inputs in the form and also add the submitForm() method to handle the form submit event. The following is the change to RegisterPage.vue:

<template>  ...  <form @submit.prevent="submitForm">    <div class="form-group"> <input ...