<script>
Vue.http.headers.common['X-CSRF-TOKEN'] = document.querySelector('#token').getAttribute('value');
var MyComponent = Vue.extend({
template: '#forum-post-like-button-template',
props:['commentId','currentUser','userLiked'],
data: function() {
return {
replyId:'',
liked: false,
current:'',
likes: 0,
users: []
};
},
ready: function() {
this.users = this.userLiked.length > 0 ? this.userLiked.split(',') : [];
this.likes = this.users.length;
this.liked = this.users.indexOf(this.currentUser) > -1;
},
methods: {
doLike: function() {
if(this.currentUser.length > 0){
this.liked = ! this.liked;
if ( this.liked) {
this.likes++;
this.addUserToList();
} else {
this.likes--;
this.removeUserFromList();
}
}else{
document.querySelector('#loginButton').click();
}
},
addUserToList: function() {
this.current = this.currentUser;
var votes = {'comment_id':this.commentId,'name':this.current};
this.$http.post('/api/comment/votes', votes,function(response){
});
this.users.push(this.current);
},
removeUserFromList: function() {
this.current = this.currentUser;
var votes = {'comment_id':this.commentId,'name':this.current};
this.$http.post('/api/comment/cancel', votes,function(response){
});
this.users.$remove(this.current);
}
}
});
Vue.component('forum-post-like-button', MyComponent);
new Vue({ el: '.replies__vue' });
</script>
<script>
new Vue({
el: '#navbar-notifications',
data: {
user_id:**,
name:'***',
title: $('title').text(),
active: false
},
ready: function() {
this.$http.get('/events/count', function (data) {
this.active = data > 0 ? true : data > 0;
document.title = data > 0 ?'('+data+')'+this.title: this.title;
this.$set('count', data);
});
var pusher = new Pusher('2fa0ac88454b92ad6455', {
encrypted: true
});
pusher.subscribe('you_have_new_notifications').bind('App\\Events\\YouHaveNewNotifications',this.countNotification)
},
methods: {
countNotification: function (user) {
if(user.user_id == this.user_id)
{
this.count ++;
document.title = '('+this.count+')'+this.title;
this.active=true;
toastr.options.closeButton = true;
toastr.options.positionClass = 'toast-bottom-right';
toastr.success('<a href="/user/notifications">你有新的消息通知!</a>',this.name);
}
}
}
});
</script>
这个是那个vue.js么 是不是和socket.io是一样的东西呢 我不太懂 这部分功能麻烦能详细说明下么 ?@JellyBool