<template>
|
<div>
|
<h1>{{ msg }}</h1>
|
<button @click="connect">连接</button>
|
<button @click="disconnect">断开连接</button>
|
<button @click="sendMessage">发送消息</button>
|
</div>
|
</template>
|
|
|
<script>
|
import io from "socket.io-client";
|
export default {
|
name: 'HelloWorld',
|
data () {
|
return {
|
socketIoClient: null,
|
msg: 'Welcome to Your Vue.js App'
|
}
|
},
|
methods: {
|
connect(){
|
let serveUri = 'http://192.168.0.200:10246'
|
this.socketIoClient = io.connect(serveUri)
|
//监听与服务器的连接状态
|
this.socketIoClient.on("connect",()=>{
|
console.log(this.socketIoClient,"------------")
|
})
|
|
this.socketIoClient.on("ClientReceive", (arg) => {
|
console.log(arg); // world
|
});
|
|
|
// this.socketIoClient = io.connect(serveUri, {
|
// 'force new connection': true,
|
// 'query': 'UID=' + 22222
|
// });
|
},
|
disconnect(){
|
this.socketIoClient.disconnect()
|
},
|
sendMessage(){
|
this.socketIoClient.emit("msg","99999999999")
|
}
|
},
|
}
|
</script>
|
