Full-Stack Web Development with Vue.js and Node

(singke) #1
Building Authentication with passport.js Chapter 6

Creating a register view page


Let's add a view page for the users to sign up. For that, we will need to create a form that


takes the name, email, and password parameters. Create a file called Register.vue


inside src/components:


<template>
<v-form v-model="valid" ref="form" lazy-validation>
<v-text-field
label="Name"
v-model="name"
required
></v-text-field>
<v-text-field
label="Email"
v-model="email"
:rules="emailRules"
required
></v-text-field>
<v-text-field
label="Password"
v-model="password"
required
></v-text-field>
<v-text-field
name="input-7-1"
label="Confirm Password"
v-model="confirm_password"
></v-text-field>
<v-btn
@click="submit"
:disabled="!valid"
>
submit
</v-btn>
<v-btn @click="clear">clear</v-btn>
</v-form>
</template>

The vue file is a simple template file that contains the form components. The next step is to


add a route for that file.

Free download pdf