标签:传送门 cti ast 聊天室 font pairs mib logo init
系列博文的传送门: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
标签:传送门 cti ast 聊天室 font pairs mib logo init
原文地址:http://www.cnblogs.com/lastpairs/p/7106867.html