javascript прослушивает несколько каналов сокетов с эхом

Итак, я понял, что у каждого пользователя должен быть свой канал.

Затем я изменил свой chat-window компонент:

<template lang="html">
  <div class="panel panel-default">
      <div class="panel-heading" style="height: 60px">
        <chat-room-picker :chatrooms="chatRooms" :newmessage="newmessage" :defaultchatroomid="pickedchatroomid" class="pull-left" v-on:chatroompicked="chatroompick"></chat-room-picker>
        <chat-room-creator class="pull-right"></chat-room-creator>
      </div>
        <chat-room :chatroomid="pickedchatroomid" :newmessage="newmessage"></chat-room>
  </div>
</template>

<script>
export default {
  data() {
    return {
     userId: loggedUserFS.id,
     userName: loggedUserFS.name,
     chatRooms: chatRoomsFS,
     pickedchatroomid: defaultChatRoomIdFS,
     newmessage: {},
    }
 },
 methods: {
   chatroompick(id) {
     this.pickedchatroomid = id;
   },
 },
 created() {
  // this.getCookiesParams();
  var tmp = this.chatRooms[0];
  this.pickedchatroomid = tmp.id;
   var channelName = 'chat-' + this.userId;
   console.debug(channelName + ", channel init.");
   window.Echo.join(channelName)
       .listen('NewMessageEvent', (e) => {
           console.debug("incoming message on " + channelName + ": " + JSON.stringify(e));
           console.debug(e.message.chatRoom_id + "==" + this.pickedchatroomid);
           console.debug(channelName +" : "+ e.message.chatRoom_id + "==" + this.pickedchatroomid);
           // TODO: finish it
           if(e.message.chatRoom_id == this.pickedchatroomid) { // if the reciced message comes from the pickedchatroom
             console.debug("reciced message comes from the pickedchatroom!");
             this.newmessage = e;
           } else { // if the reciced message does not come from the pickedchatroom
             this.newmessage = e;
           }
       });
  }
}
</script>

<style lang="css">
</style>

Я сделал chat-room-picker что-то выпадающее, и с его помощью вы можете менять чаты. И есть компонент chat-room для отображения сообщений текущего чата. В обоих компонентах есть vue-watch-es, и новое сообщение изменено, чат-комната добавляет сообщение (если сообщение принадлежит текущей чат-комнате), иначе ничего не делайте, и chat-room-picker начинает мигать, если сообщение принадлежит в другую комнату.

chat-room-picker часы:

  watch : {
    newmessage : function (value) {
      var message = value;
      var picker = $(".chatRoomPicker");
      //TODO: check that the message belongs to current chat room
      picker.addClass("blink");
      picker.on("click", function() {
        picker.removeClass("blink");
      });
    }
  }

Контрольная часть компонента чат-комнаты:

  watch : {
    chatroomid : function (value) { // if chat-room is changed
      this.getChatRoomMessages();
    },
    newmessage : function(value) {  // TODO: here or parent component check the room of the message
      console.debug("newmessage received:" + JSON.stringify(value));
      var msgTmp = value.message;
      msgTmp.user = value.user;

      this.messages.push(msgTmp);
    }
  },

на стороне сервера (в контроллере):

broadcast(new NewMessageEvent($message, $user, $usersOfChatRoom));

а мой broadcastOn метод NewMessageEvent выглядит так:

public function broadcastOn()
{
    $channels = [];
    foreach ($this->usersOfChatRoom as $addressee) {
      if($addressee->id != $this->user->id) {
        array_push($channels, new PresenceChannel('chat-' . $addressee->id));
      }
    }
    Log::debug("broadcastOn channels: " . json_encode($channels));
    return $channels;
  //
}

Я знаю, что это не закончено, но я прокомментировал, где нужно закончить код.

Возможно, это не самый элегантный способ, но он работает. Если у кого-то еще есть другое решение, пожалуйста, поделитесь им!