使用 Socket.on 在客户端监听不起作用

Question

当我尝试使用 socket.to(roomId).emit('msgToClient', data) 将其发送到特定房间 ID 时，我的客户端在反应时不监听任何消息，但如果我使用 socket.emit('msgToClient', data) 工作正常，我在下面添加我的客户端和服务器端代码。

在React客户端中使用Chat钩子接收服务器消息message.NestJs

const useChat = (roomId) => {
  const [messages, setMessages] = useState([]); // Sent and received messages
  const socketRef = useRef();

  useEffect(() => {
    
    // Creates a WebSocket connection
    socketRef.current = io(SOCKET_SERVER_URL, {
        query: { roomId },  transports: ['websocket'] });
    
    // Listens for incoming messages
    socketRef.current.on('msgToClient', (message) => {
      const incomingMessage = {
        ...message,
        ownedByCurrentUser: message.senderId === socketRef.current.id,
      };
      setMessages((messages) => [...messages, incomingMessage]);
    });
    
    // Destroys the socket reference
    // when the connection is closed
    return () => {
      socketRef.current.disconnect();
    };
  }, [roomId]);

  return { messages, sendMessage, joinRoom };
};

export default useChat;

中的gateway将其发送到客户端

@WebSocketGateway()
export class MessageGateway
  implements OnGatewayInit, OnGatewayConnection, OnGatewayDisconnect
{
  @WebSocketServer() socket: Socket;

  private logger: Logger = new Logger('MessageGateway');

  @SubscribeMessage('msgToServer')
  public handleMessage(client: Socket, payload: any): void {
    this.socket.to(client.handshake.query.roomId).emit('msgToClient', payload);
  }
}