在某些操作vuejs之后启动套接字连接

时间:2017-11-24 10:24:19

标签: sockets vue.js vuex

我需要使用socket io。我从官方文档中创建代码

import VueSocketio from 'vue-socket.io'
import socketio from 'socket.io-client'
Vue.use(VueSocketio, socketio('http://b5870557.ngrok.io'), store)

将此代码粘贴到我的vuex main.js.但是当我打开第一页时它会建立连接。但我应该在下载一些页面或按下按钮后打开连接。但如果我写动作

 setSocketConnection({commit}, url) {
        Vue.use(VueSocketio, url)
        commit('SOCKET_CONNECT')
    }

并称之为需要的地方

created() {
    this.$store.dispatch('setSocketConnection', 'MySocketUrl')
}

我无法获得任何发射,我的意思是事件监听器无法正常工作

sockets: {
  someEmit: function(data) {
                console.log(data)
            }
}

1 个答案:

答案 0 :(得分:0)

如果您使用的是vue-router,则可以执行以下操作:

{
   path: '/BB',
   name: 'BB',
   component: BB,
   beforeEnter (to, from, next) {
      if (!Vue.prototype.$socket) { 
         Vue.use(VueSocketio, WS_URL)
      }
      next()
   }
}

来源:How to disabled vue-socket.io in some vue-router component