Merge c6b6f3e342 into 61614c865e

README.md

@@ -57,6 +57,7 @@ new Vue({
 ```
 
 ##### Using socket.io-client Instance
+###### For vue 2 
 ``` javascript
 import Vue from 'vue'
 import store from './store'
@@ -84,6 +85,31 @@ new Vue({
 }).$mount('#app')
 ```
 
+###### For vue 3
+``` javascript
+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'
+
+const vueSocket = new VueSocketIO({
+    debug: true,
+    connection: SocketIO('http://metinseylan.com:1992', options), //options object is Optional
+    vuex: {
+        store,
+        actionPrefix: "SOCKET_",
+        mutationPrefix: "SOCKET_"
+    }
+});
+
+createApp(App)
+    .use(store)
+    .use(router)
+    .use(vueSocket)
+	.mount('#app');
+```
+
 **Parameters**|**Type's**|**Default**|**Required**|**Description**
 -----|-----|-----|-----|-----
 debug|Boolean|`false`|Optional|Enable logging for debug

src/index.js

@@ -28,17 +28,18 @@ export default class VueSocketIO {
      */
     install(Vue){
 
-        const version = Number(Vue.version.split('.')[0])
+        const version = Number(Vue.version.split('.')[0]);
 
         if (version >= 3) {
             Vue.config.globalProperties.$socket = this.io;
             Vue.config.globalProperties.$vueSocketIo = this;
+		        Vue.mixin(Mixin(true));
         } else {
             Vue.prototype.$socket = this.io;
             Vue.prototype.$vueSocketIo = this;
+		        Vue.mixin(Mixin(false));
         }
 
-        Vue.mixin(Mixin);
 
         Logger.info('Vue-Socket.io plugin enabled');
 

src/mixin.js

@@ -1,4 +1,4 @@
-export default {
+export default (isVue3) => ({
 
     /**
      *  Assign runtime callbacks
@@ -39,7 +39,7 @@ export default {
     /**
      * unsubscribe when component unmounting
      */
-    beforeDestroy(){
+    [isVue3 ? 'beforeUnmount' : 'beforeDestroy'](){
 
         if(this.$options.sockets){
 
@@ -53,4 +53,4 @@ export default {
 
     }
 
-}
+});