首页 > 代码库 > 基于网络聊天室的社交游戏 -- vue、socket.io-client
基于网络聊天室的社交游戏 -- vue、socket.io-client
系列博文的传送门:http://www.cnblogs.com/lastpairs/p/6993237.html
客户端代码github地址 https://github.com/xxyjskx1987/lastpairswebapp
服务器端代码github地址 https://github.com/xxyjskx1987/lastpairsnodeserver
项目演示地址 http://www.tanmiba.com/
socket.io在BS架构的即时通信工具中,可以说是不二选择,本例在vue中使用socket.io,将其封装为常量模块,通过import引用。
安装socket.io
npm install socket.io -s
模块封装
import io from ‘socket.io-client‘ const CHAT = { socket: null, msgArr: [],
logout: function(){
this.socket.disconnect();
}, init: function(){ this.socket = io.connect(‘ws://127.0.0.1:3000‘); this.socket.on(‘login‘, function(obj){ CHAT.msgArr.push(obj) }); //监听用户退出 this.socket.on(‘logout‘, function(o){ }); } } export default CHAT
在VUE文件中调用示例
<script> import CHAT from ‘client‘ export default { name: ‘‘, data () { return { } }, mounted(){ CHAT.init() }, methods: { logout: function() { CHAT.logout() } } } </script>
业务功能可以在socket-client中添加方法,调用方式同如上所示。
基于网络聊天室的社交游戏 -- vue、socket.io-client
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。