用vue写一个WebSocket

当然可以！下面是一个使用 Vue.js 来实现 WebSocket 连接的示例代码：

首先，你需要在 Vue 组件中引入 WebSocket 对象，可以使用 `vue-native-websocket` 插件来简化操作。安装该插件：

npm install vue-native-websocket

然后，在你的 Vue 组件中，你可以按照以下的方式来使用 WebSocket：

<template>
  <div>
    <div v-if="connected">Connected to WebSocket server!</div>
    <div v-else>Not connected to WebSocket server.</div>
  </div>
</template>

<script>
import VueNativeSock from 'vue-native-websocket';

export default {
  data() {
    return {
      connected: false
    };
  },
  mounted() {
    // 根据你的需要设置 WebSocket 的配置
    this.$options.sockets = {
      connect: () => {
        this.connected = true;
      },
      disconnect: () => {
        this.connected = false;
      }
    };

    // 连接到 WebSocket 服务器
    this.$connect('ws://your-websocket-server-url');
  },
  destroyed() {
    // 断开 WebSocket 连接
    this.$disconnect();
  }
};
</script>

在上面的示例代码中，我们使用了 `vue-native-websocket` 插件来创建了一个 VueNativeSock 对象，并通过 `this.$connect()` 方法连接到了指定的 WebSocket 服务器。当连接成功时，`connected` 变量会被设置为 `true`，反之则为 `false`。当组件销毁时，我们使用 `this.$disconnect()` 方法断开 WebSocket 连接。

你可以根据自己的需要，修改上述代码以适应你的项目要求。希望能对你有所帮助！