vue3连接websocket

在Vue 3中连接WebSocket，你可以按照以下步骤进行操作：

1. 首先，安装WebSocket库。你可以使用npm或yarn来安装`websocket`库：

npm install websocket

2. 在你的Vue组件中，导入WebSocket库：

import WebSocket from 'websocket';

3. 创建一个WebSocket实例，并在Vue组件的`created`钩子中进行初始化：

export default {
  created() {
    const ws = new WebSocket('ws://localhost:8080'); // 替换为你的WebSocket服务器地址

    ws.onopen = () => {
      console.log('WebSocket连接已打开');
    };

    ws.onmessage = (event) => {
      console.log('收到WebSocket消息:', event.data);
    };

    ws.onclose = () => {
      console.log('WebSocket连接已关闭');
    };
  },
};

在上面的代码中，我们创建了一个WebSocket实例，并通过指定服务器地址进行初始化。然后，我们定义了`onopen`、`onmessage`和`onclose`回调函数来处理WebSocket的连接、接收消息和关闭连接事件。

4. 如果需要发送消息，你可以在Vue组件的方法中调用WebSocket实例的`send`方法：

export default {
  methods: {
    sendMessage(message) {
      ws.send(message);
    },
  },
};

在上述代码中，我们定义了一个`sendMessage`方法，该方法接收一个消息参数，并通过调用WebSocket实例的`send`方法将消息发送到服务器。

这样，你就可以在Vue 3中连接和使用WebSocket了。记得替换`new WebSocket`的地址为你的实际WebSocket服务器地址。