title: Vuejs not firing code when receiving message from socket.io server
body: <p>I've been working on allowing a vuejs app talk to a remote, standalone socket.io server. I've managed to get the vuejs app to send messages to the socket.io server (confirmed through console logs on the nodejs instance), and I appear to be getting the responses back, but I can't seem to get it to fire code based on the responses.</p>
  
  <p>I'm using Vue-socket.io, in the most basic form and i've added localhost and null to origins to hopefully rule out that issue. </p>
  
  <ul>
  <li>I'm running socket.io server on localhost:3000 </li>
  <li>I'm running vuejs app
  on localhost:8888</li>
  </ul>
  
  <p>Why aren't the listeners firing in the following code? I also don't get any of the console logs for sockets.connect and sockets.customMessage in app.vue.</p>
  
  <p><strong>socket.io (nodejs) server:</strong></p>
  
  <pre><code>var http = require('http').createServer({
      origins: ['localhost','null',null]
  });
  var io = require('socket.io')(http);
  
  io.on('connection', (socket) =&gt; {
      console.log('a user connected');
      socket.broadcast.emit('hi, welcome to live chat');
      socket.on('disconnect', () =&gt; {
          console.log('user disconnected');
      });
      socket.on('chatMessage', (msg) =&gt; {
          console.log('chatMessage: ' + msg);
          io.emit('chatMessage', msg);
      });
  })
  
  
  
  http.listen(3000, () =&gt; {
      console.log('listening on port 3000');
  });
  </code></pre>
  
  <p><strong>app.js (entry point for vuejs app):</strong></p>
  
  <pre><code>import Vue from 'vue'
  //import store from './store'
  import App from './App.vue'
  import VueSocketIO from 'vue-socket.io'
  import SocketIO from "socket.io-client"
  
  Vue.use(new VueSocketIO({
      debug: true,
      connection: 'http://localhost:3000'
  }))
  
  new Vue({
      render: h =&gt; h(App)
  }).$mount('#app')
  </code></pre>
  
  <p><strong>App.vue:</strong></p>
  
  <pre><code>&lt;template&gt;
      &lt;div&gt;
          hello chat app
          &lt;input type="text" v-model="message"/&gt;
          &lt;button @click="clickButton()"&gt;Send Msg&lt;/button&gt;
      &lt;/div&gt;
  &lt;/template&gt;
  
  &lt;script&gt;
      export default {
          name: "Home",
          sockets: {
              connect: function () {
                  console.log('socket connected')
              },
              chatMessage: function(data) {
                  console.log('this method was fired by the socket server. eg: io.emit("chatMessage", data)')
  
              }
          },
          methods: {
              clickButton: function () {
                  console.log('button clicked');
                  console.log(this.message);
                  // $socket is socket.io-client instance
                  this.$socket.emit('chatMessage', this.message)
              }
          },
          data: () =&gt; {
              return {
                  message: '',
              };
          },
          computed: {
  
          },
          mounted() {
              this.$socket.on('chatMessage',data =&gt; {
                  console.log('listen fired')
                  console.log(data);
  
              });
          }
      }
  &lt;/script&gt;
  </code></pre>