V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
pin621
V2EX  ›  React

socket.io-client 前端一直监听发送不了消息到服务端

  •  
  •   pin621 · 2020-12-08 13:46:20 +08:00 · 1797 次点击
    这是一个创建于 1480 天前的主题,其中的信息可能已经有所发展或是发生改变。

    //SocketProvider.tsx

    import React, { useContext, useEffect, useState } from 'react';
    import { io } from 'socket.io-client';
    /**
     * 创建 context
     */
    const SocketContext = React.createContext(null)
    
    /**
     * 调用 socket
     */
    export function useSocket() {
      return useContext(SocketContext)
    }
    
    /**
     * 提供 socket
     * @param children 子组件
     */
    export function SocketProvider({ children }) {
      const [socket, setSocket] = useState()
    
      useEffect(()=>{
        const newSocket = io('ws://localhost:7001')
        setSocket(newSocket)
    
        return () => newSocket.close()
      }, [])
    
      return (
        <SocketContext.Provider value={socket}>
          {children}
        </SocketContext.Provider>
      )
    }
    

    //app.tsx 中使用 SocketProvider

     <SocketProvider>
     	{children}
     </SocketProvider>
    

    //子组件中调用 socket

     const socket= useSocket()
     console.log(socket)
    

    //控制台 socket 对象

    acks: proto: Object connected: false disconnected: true

    2 条回复    2020-12-08 18:45:07 +08:00
    joesonw
        1
    joesonw  
       2020-12-08 14:13:38 +08:00
    socket.on('connect')之后才算连上吧

    https://github.com/streamich/react-use/blob/master/docs/useAsyncFn.md 这个包一下
    zhongrs232
        2
    zhongrs232  
       2020-12-08 18:45:07 +08:00
    巧了这头像
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   2690 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 25ms · UTC 12:43 · PVG 20:43 · LAX 04:43 · JFK 07:43
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.