vue使用 封裝websocket心跳包

2021-10-23 22:37:03 字數 1300 閱讀 2353

這套**可以拿過去直接用 一些注意我會在下面**中加上注釋:

謝謝支援

直接上**

核心**

//這裡需要引入vuex


import store from


'./store'


;let wsconnection =


,//開啟websocket


wsopen:


function


(e),


wsclose:


function


(e),


wsmsg:


function


(msg)


,  wserror:


function


(err)


,//重啟websocket


reconnect:


function()


_this.lockreturn =


true


;    _this.timeoutnum &&


cleartimeout


(_this.timeoutnum)


;    _this.timeoutnum =


settimeout


(function()


,3000);


},startwsheartbeat:


function()


}, _this.timeout);}


,//重置websocket心跳


resetheartbeat:


function()


};//丟擲websocket物件


export


default wsconnection
websocket方法呼叫

//在main.js引入


import wsconnection from


'./vuex/wsstore'


//掛載vue原型鏈


vue.prototype.$setws = wsconnection;


//在使用地方呼叫


$this


.$setws.


initwebsocket()


;//在需要使用服務端推送過來的訊息時


//在computed方法宣告


getwsmsg()


//在watch方法   監聽  getwsmsg


getwsmsg:


function


(data, val)
=end

=

vue 封裝公共元件 學習 使用

在vue 專案中 會有很多類似的內容 因公司 經常做支付這一塊 像下面的類似的功能還有很多地方要用 因此嘗試 乙個很簡單的小封裝 子元件 sub pay pay left total span div pay amount 實付金額 div div pay right click onpaybtn ...

vue中axios的封裝使用

npm install axios s 或者 npm i axios simport axios from axios vue.prototype.axios axios 將axios繫結到vue的原型上module.exports before import axios from axios im...

vue動態使用svg,封裝為元件使用

0.需要安裝的庫 1.在assets檔案下建立icons資料夾 2.在components資料夾下建立svgicon元件 3.vue.config.js檔案的配置項 4.使用 基於vue cli3配置，配置檔案為vue.config.js devdependencies import vue fro...