vue3中使用vue-socket.io

在Vue 3中使用vue-socket.io，你可以按照以下步骤进行操作：

1. 首先，安装`vue-socket.io`包。在命令行中运行以下命令：

npm install vue-socket.io

2. 在你的Vue应用程序中，创建一个新的`socket.js`文件（或任何其他你喜欢的名称），并添加以下代码：

import { createApp } from 'vue';
import VueSocketIO from 'vue-socket.io';
import App from './App.vue';

const app = createApp(App);

app.use(new VueSocketIO({
  debug: true,
  connection: 'http://localhost:3000', // 替换为你的Socket.io服务器地址
}));

app.mount('#app');

3. 确保你已经安装了`socket.io-client`包。如果没有，请在命令行中运行以下命令进行安装：

npm install socket.io-client

4. 在你的Vue组件中，你可以通过`this.$socket`来访问Socket.io客户端的实例。例如，在`App.vue`文件中，你可以添加以下代码：

export default {
  created() {
    this.$socket.emit('message', 'Hello from Vue!');
    
    this.$socket.on('response', (data) => {
      console.log(data);
    });
  },
};

在上面的代码中，我们通过`this.$socket.emit`发送了一个名为"message"的事件，并监听了名为"response"的事件。

现在，你就可以在Vue 3应用程序中使用vue-socket.io了。请确保替换连接地址为你的Socket.io服务器的地址，并根据你的需求进行更改。