Vuevue前端开发

vue 中使用websocket,结合vuex实现实时监听

2019-05-24  本文已影响456人  bartflyian

当项目中拥有vuex状态管理,再使用WebSocket 时,会发现监听实时数据十分得心应手。以下聊一聊二者的结合使用;

socket.js

在此文件中建立websocket连接,并暴露出去。

接下图 接上图

创建websocket连接后,在main.js中,将数据用vuex保存起来。

main.js中

引入 switch中根据收到不同的socket ation头去执行不同的保存

如第一个:

通过vuex保存socket数据,又可以在收到实时数据时,进行相应的保存和修改。

在页面中可以通过监听store中保存的值来实时显示与变化。

上一篇 下一篇

猜你喜欢

热点阅读