git文档地址:查看文档
版本:3.0.x
vue-socket.io插件提供了很便利的使用websocket的方式
简单例子:
服务端提供两个事件"USER_INFO"(前端接收数据)、"SET_USER_INFO"(前端上传数据)
1. 组件内使用:
main.js
import VueSocketIO from "vue-socket.io";
Vue.use(
new VueSocketIO({
connection: "http://127.0.0.1:3000"
})
);
组件内Home.vue
export default {
data() {
return {
info: {
id: 123,
name: '张三'
}
}
},
sockets: {
//接收数据 'USER_INFO'(data) {} 定义字符串为方法名也是可以的
USER_INFO(data) {
this.info = data
}
},
methods: {
submit() {
//上传数据
this.$socket.emit('SET_USER_INFO', this.info);
}
}
}
动态注册数据接收可以用 this.so