vue3 销毁WebSocket消息推送

Vue3 中销毁 WebSocket 消息推送通常发生在组件卸载或页面路由改变时，以避免在不必要的时候继续消耗资源。以下是关闭 WebSocket 连接的一般步骤：

1. **在组件实例中创建 WebSocket 连接**：

export default {
  setup() {
    const socket = new WebSocket('ws://your-websocket-url');

    // ...其他组件逻辑

    return { socket };
  },
};

2. **在 `beforeDestroy` 生命周期钩子中关闭连接**：
Vue3 的生命周期钩子已经简化，你可以使用 `onUnmount` 或者手动添加 `beforeDestroy`：

import { onUnmount } from 'vue';

export default {
  setup() {
    const socket = new WebSocket('ws://your-websocket-url');
    
    // 添加 beforeDestroy 钩子，确保在组件卸载前关闭连接
    onUnmount(() => {
      if (socket.readyState !== WebSocket.CLOSED) {
        socket.close();
      }
    });

    // ...其他组件逻辑

    return { socket };
  },
};

这里我们检查了 WebSocket 是否已经关闭，如果是关闭状态，则无需再操作。