socketio在vue中的使用

在vue中的使用

• 下载依赖项

npm install vue-socket.io 

• 引入

import VueSocketio from 'vue-socket.io'

• 挂载(后面是服务器地址)

Vue.use(VueSocketio, 'http://47.92.118.237:5001/')

• 使用

socket和data、mounted、methods同级

 data(){
     return{
         id:''
     }
 }
 sockets: {
  //这里是监听connect事件
    connect: function () {
     //接收服务端发来的推送
      this.id = this.$socket.id
    }, 
    // 方法名与服务端的保持一致
    server_response: function (res) {
      //以下对接收来的数据进行操作
        console.log(res)
        if (carNum) {
            this.carNum = carNum
            //获取完数据调用的页面方法
            this.goWay()
          }
        } else {
          // console.log('暂无数据')
        }
      }
    }
  },

 

注意点

如果出现页面显示不出来，或者出现 TypeError: Cannot call a class as a function

可以尝试把依赖 替换成 "vue-socket.io": "^2.1.1-a"

相关连接

https://www.cnblogs.com/zyulike/p/10209562.html