Question

我使用pusher，Laravel echo和vue.js进行聊天，就像图片一样 the chat app

这是vue.js代码

var myChat = new Vue({
  el: '#myChat',
  data: { 
      the_chat: '', 
      current_user_id: 1,  
  },
  mounted(){
      this.set_user_id();
       window.Echo.channel( 'the_chat.'+this.current_user_id ) 
          .listen('SendMessage' ,(e) => {
            myChat.the_chat.push(e.chat);
            console.log('the_chat.'+this.current_user_id +'  -----');
      });
  },
  methods:{
     choose_user:function(user_id,model){
          $.get(api_get_chat+'/'+user_id,function(response){
              myChat.the_chat = response; 
              myChat.current_user_id = user_id; 
              console.log( myChat.echo_the_chat_id );
          });
      }
}

首先current_user_id = 1它只回显频道the_chat.1 但是当current_user_id更改为2时，它仍然只回显到频道the_chat.1和console.log

the_chat.2 ----

由于

console.log('the_chat.'+this.current_user_id +'  -----');

Answer 1

我认为问题比你想象的要困难得多。

首先：安装组件时，此代码只运行一次window.Echo.channel()。当您更改Id变量时，此代码不会再次注册通道监听。

第二：控制台写入修改后的ID变量，因为日志编写器使用该引用变量，更改内容。（我希望你理解。:)）

解决方案：您应该将ID变量更改逻辑移动到父组件，并在每次id更改事件时重新呈现/重新安装此组件。（或丑陋的方式：你应该在id上制作一个watch方法，每当它改变时，重新注册通道监听。但是自我重新安装不是一个好方法..）

我希望它有所帮助！：）

Laravel echo不支持动态id

1 个答案: