Instantly share code, notes, and snippets.

Embed
What would you like to do?
const LoginComponent = Vue.component('login-component', {
template: '<div class="signin-wrapper text-center"> \
<form class="form-signin"> \
<h1 class="h3 mb-3 font-weight-normal">Please sign in</h1> \
<label for="inputEmail" class="sr-only">Email address</label> \
<input v-model="email" type="email" id="inputEmail" class="form-control" placeholder="Email address" required="" autofocus=""> \
<label for="inputPassword" class="sr-only">Password</label> \
<input v-model="password" type="password" id="inputPassword" class="form-control" placeholder="Password" required=""> \
<button v-on:click="login" class="btn btn-lg btn-primary btn-block" type="button">Sign in</button> \
<p class="mt-5 mb-3 text-muted">© 2017-2018</p> \
</form> \
</div>',
data : function () {
return {
email : "",
password : ""
}
},
methods : {
login () {
if (this.email.length === 0) {
alert("Please enter an email");
return;
}
if (this.password.length === 0) {
alert("Please enter a password");
return;
}
Parse.User.logIn(this.email, this.password)
.then(() => {
// Used an arrow function here because I
// want to access 'this' which is overridden in
// a conventional function
this.$router.replace("/");
})
.catch(function(e) {
alert ("Error logging in! " + e.message);
});
}
}
})
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment