我用了一個比較tricky的方式解決，但并不是真正的解決方案。
var joinRoom = $('#joinRoom'),joinRoomLabel=$('#joinRoomLabel'),curRoomId,
onlineAlert=$('#onlineAlert'),offlineAlert=$('#offlineAlert'),chatLeft=$('#chatLeft');
Vue.component('room',{
props:['message'],
methods:{
selectRoom:function(){
chatLeft.empty();
curRoomId = this.message._id;
joinRoomLabel.text(this.message.roomName);
joinRoom.modal('toggle');
socket.emit('online', {user: from, curRoomId: curRoomId});
if(this.message.roomChat=='secret'){
vRoom.getUsers();
}else{
vRoom.getpUsers();
}
}
},
template: '<div class="room"><div class="room-header"><div class="room-header-back"></div><div class="room-header-content"><div>{{message.roomName}}</div><div><span class="glyphicon glyphicon-plus-sign" v-on:click="selectRoom"></span></div></div></div><div class="room-body"><img src="/public/imgs/0.png"><div class="room-text">{{message.roomContent}}</div></div><div class="room-footer"><div class="room-footer-back"></div><div class="room-footer-content"><div class="room-peos">參與：<span>{{message.roomJoinPeos}}人</span></div><div><span class="glyphicon glyphicon-heart"></span></div> </div></div></div>'
});
var vRoom = new Vue({
el:'#joinRoom',
data:{
users:[],
messageBody:'',
roomChat:'',
roomJoinPeos:''
},
methods:{
upUsers:function(data){
this.users = [];
var us = [];
for(var u in data){
us.push(u);
}
if(us.length==3){
alert("房間已滿,但在同一房間的人會知道您曾經(jīng)嘗試進(jìn)入該房間");
joinRoom.modal('toggle');
this.closeRoom();
return;
}
this.users = us;
},
getUsers:function(){
$.get('/room/users/'+curRoomId,function(data){
this.upUsers(data);
}.bind(this));
},
uppUsers:function(data){
this.users = [];
var us = [];
for(var u in data){
us.push(u);
}
this.users = us;
},
getpUsers:function(){
$.get('/room/users/'+curRoomId,function(data){
this.uppUsers(data);
}.bind(this));
},
sendMessage:function(){
if(this.messageBody){
chatLeft.append(' <div class="chatLeftOwenr"><div class="chatLeftOwenrPeo">'+from+'</div><div class="chatLeftOwenrContent">'+this.messageBody+'</div></div>');
socket.emit('say',{toObj:'all',messageBody:this.messageBody,curRoomId:curRoomId,user:from});
this.messageBody='';
}
},
closeRoom:function(){
socket.emit('offline',{curRoomId:curRoomId,user:from});
curRoomId = '';
}
}
})
