當項目中擁有vuex狀態管理,再使用WebSocket 時,會發現監聽實時數據十分得心應手。以下聊一聊二者的結合使用;
socket.js
在此文件中建立websocket連接,并暴露出去。
接下圖
接上圖
創建websocket連接后,在main.js中,將數據用vuex保存起來。
main.js中
引入
switch中根據收到不同的socket ation頭去執行不同的保存
如第一個:
通過vuex保存socket數據,又可以在收到實時數據時,進行相應的保存和修改。
在頁面中可以通過監聽store中保存的值來實時顯示與變化。