vue如何使用VueUse的useWebSocket

前言

useWebSocket这个方法实现低代码，记录一下。

使用方法

使用方法很简单

import { useWebSocket } from '@vueuse/core'

const { status, data, send, open, close } = useWebSocket('ws://websocketurl')

上述的data就是从服务器发回来的数据，send就是往服务器发送数据，直接用就可以了。

使用data

//获取数据时必须要监视，此处的data就是上面结构出的data
watch(data, () => {
  //获取到的数据为data.value
    console.log(data.value)
})

使用send

//需要发送给服务器的数据
const info = "你好吗?"

//send方法，此处的send为上面解构出的send
send(info)

其他

看官方文档意思是，连接和关闭都是自动的，心跳机制等均可以参看官方文档useWebSocket | VueUse