vue2/examples/firebase/app.js

51 lines
1.2 KiB
JavaScript
Raw Normal View History

2014-09-24 09:06:32 +08:00
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,}))$/
2016-04-14 12:27:34 +08:00
// Firebase ref
var usersRef = new Firebase('https://vue-demo.firebaseIO.com/users')
2014-09-24 09:06:32 +08:00
2016-04-14 12:27:34 +08:00
// create Vue app
2014-09-24 09:06:32 +08:00
var app = new Vue({
// element to mount to
el: '#app',
// initial data
data: {
newUser: {
name: '',
email: ''
}
},
2016-04-14 12:27:34 +08:00
// firebase binding
// https://github.com/vuejs/vuefire
firebase: {
users: usersRef
},
2014-09-24 09:06:32 +08:00
// computed property for form validation state
computed: {
2015-08-03 00:04:56 +08:00
validation: function () {
return {
name: !!this.newUser.name.trim(),
email: emailRE.test(this.newUser.email)
2014-09-24 09:06:32 +08:00
}
2015-08-03 00:04:56 +08:00
},
isValid: function () {
var validation = this.validation
return Object.keys(validation).every(function (key) {
return validation[key]
})
2014-09-24 09:06:32 +08:00
}
},
// methods
methods: {
2015-10-14 00:22:10 +08:00
addUser: function () {
2014-09-24 09:06:32 +08:00
if (this.isValid) {
2016-04-14 12:27:34 +08:00
usersRef.push(this.newUser)
2015-08-03 00:04:56 +08:00
this.newUser.name = ''
this.newUser.email = ''
2014-09-24 09:06:32 +08:00
}
},
removeUser: function (user) {
2016-04-14 12:27:34 +08:00
usersRef.child(user['.key']).remove()
2014-09-24 09:06:32 +08:00
}
}
2015-08-03 00:04:56 +08:00
})