You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
51 lines
1.2 KiB
51 lines
1.2 KiB
9 years ago
|
var emailRE = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/
|
||
|
|
||
|
// Firebase ref
|
||
|
var usersRef = new Firebase('https://vue-demo.firebaseIO.com/users')
|
||
|
|
||
|
// create Vue app
|
||
|
var app = new Vue({
|
||
|
// element to mount to
|
||
|
el: '#app',
|
||
|
// initial data
|
||
|
data: {
|
||
|
newUser: {
|
||
|
name: '',
|
||
|
email: ''
|
||
|
}
|
||
|
},
|
||
|
// firebase binding
|
||
|
// https://github.com/vuejs/vuefire
|
||
|
firebase: {
|
||
|
users: usersRef
|
||
|
},
|
||
|
// computed property for form validation state
|
||
|
computed: {
|
||
|
validation: function () {
|
||
|
return {
|
||
|
name: !!this.newUser.name.trim(),
|
||
|
email: emailRE.test(this.newUser.email)
|
||
|
}
|
||
|
},
|
||
|
isValid: function () {
|
||
|
var validation = this.validation
|
||
|
return Object.keys(validation).every(function (key) {
|
||
|
return validation[key]
|
||
|
})
|
||
|
}
|
||
|
},
|
||
|
// methods
|
||
|
methods: {
|
||
|
addUser: function () {
|
||
|
if (this.isValid) {
|
||
|
usersRef.push(this.newUser)
|
||
|
this.newUser.name = ''
|
||
|
this.newUser.email = ''
|
||
|
}
|
||
|
},
|
||
|
removeUser: function (user) {
|
||
|
usersRef.child(user['.key']).remove()
|
||
|
}
|
||
|
}
|
||
|
})
|