<template>

??<div?class="test">

??</div></template><script>

??export?default?{????name?:?'test',

????data()?{??????

return?{????????

websock:?null,

??????}

????},

????created()?{??????

this.initWebSocket();

????},

????destroyed()?{??????

this.websock.close()?//離開路由之后斷開websocket連接

????},????methods:?{

??????initWebSocket(){?//初始化weosocket

????????const?wsuri?=?"ws://127.0.0.1:8080";????????

this.websock?=?new?WebSocket(wsuri);????????

this.websock.onmessage?=?this.websocketonmessage;???????

?this.websock.onopen?=?this.websocketonopen;???????

?this.websock.onerror?=?this.websocketonerror;????????

this.websock.onclose?=?this.websocketclose;

??????},

??????websocketonopen(){?//連接建立之后執(zhí)行send方法發(fā)送數(shù)據(jù)

????????let?actions?=?{"test":"12345"};???????

?this.websocketsend(JSON.stringify(actions));

??????},

??????websocketonerror(){//連接建立失敗重連

????????this.initWebSocket();

??????},

??????websocketonmessage(e){?//數(shù)據(jù)接收

????????const?redata?=?JSON.parse(e.data);

??????},

??????websocketsend(Data){//數(shù)據(jù)發(fā)送

????????this.websock.send(Data);

??????},

??????websocketclose(e){??//關(guān)閉

????????console.log('斷開連接',e);

??????},

????},

??}</script><style?lang='less'>

?</style>