TypeError: this.$socket.$unsubscribe is not a function

[ieshan]

Please take a look at the following link on App.vue line 38 and 39

Example Link

The $subascribe function does not exist.

[probil]

Try version 4.0.0 For some reason tests were unable to catch such an issue.

Thanks for your issue BTW :+1:

[ieshan]

@probil seems like the issue exists in 4.0.0 too in a different way.

When the page is loaded the first time and the Vue instance is created() the $subscribe function was available, but when I moved to another page and destroyed() called the $unsubscribe it raised TypeError. Again when I moved to the (without reloading) page the $subscribe function was not available.

Could this be the cause of it?

Probable Cause

[steevepay]

I'm having the same issue. When I change the route and come back, the $subscribe is not available anymore.

[Lavhe]

I am still facing this issue

[ross-crowdsmart]

I am also facing this issue. Will this be fixed soon?

[zburk]

@probil Issue still not resolved. This is a pretty big issue as it renders the $subscribe and $unsubscribe useless

[probil]

It seems like introducing this.$socket.$subscribe was a mistake. 🤔

For now you can attach events directly on the socket instance, e. g.:

// subscribe
this.$socket.client.on('eventName', () => {
    // some code here
})

// unsubscribe
this.$socket.client.off('eventName', () => {
   // some code here
})

[probil]

Will try to check other use cases and probably release the next version without this.$socket.$subscribe :|

[TBetcha]

Has anyone found a solution for this? I am actively experiencing it.

[probil]

@TBetcha The solution is mentioned above https://github.com/probil/vue-socket.io-extended/issues/431#issuecomment-636210150

[19apoorv97]

// App.vue
mounted(){
  this.$socket.client.off('userSubscription');
  //this.$socket.client.on('userSubscription', (payload) => {console.log(payload)});
},

// server
socket.emit('userSubscription','Send this message to only those who subscribed');

plz show me how to handle this on server side because even though i write this.$socket.client.off('userSubscription'); it is still printing on console

[probil]

@19apoorv97 There is one important thing I haven't mentioned. You need to pass the same function to .off(event_name, fn) in order to unsubscribe properly, .off(event_name) without passed function won't work. The reason for this is that there might be tons of other functions listening. Socket io needs to know which exact function you want to unsubscribe.

export default {
  methods: {
    onEventName() {},
  },
  mounted() {
    // subscribe
    this.$socket.client.on('eventName', this.onEventName)
  },
  beforeDestroy() {
    // unsubscribe
    this.$socket.client.off('eventName', this.onEventName)
  },
}