reactjs - 每当我从 Socket.io 接收数据并将其添加到我的反应状态时，状态就会被清除

Question

const CONNECTION_PORT = "http://localhost:3001/";
    const [msg,setmsg] = useState([])

    useEffect(() => {
        // make new room
        // Socket connection

        socket = io(CONNECTION_PORT);

        console.log("running");

        if (isAuthenticated) {
            console.log("now actually running");

            let { name, sub } = user
            roomid = uuid()
            console.log("here" + roomid);
            console.log("making room");

            socket.emit('join-room', {
                roomid,
                name,
                sub
            });

        }

        // Notify when person creates new room and add it to state called rooms
        socket.on('newroomadded', (data) => {
            setrooms(rooms.concat(data));
            console.log(rooms);
        })
        socket.on('room-created', (data) => {
            console.log(data);
            if (!rooms.includes(data)) {
                console.log(data);
                console.log("does not exist");

                setrooms(rooms.concat(data))
            }
            else {
                console.log("exists");
            }

        })
        socket.on('message', (data) => {
            console.log(data);
            console.log(msg);
            setmsg(msg.concat(data))
        })
        return () => {
            socket.off('message')
            socket.off('room-created')
            socket.off('newroomadded')
        }
    }, [])

    useEffect(() => {
        console.log(messages);
    }, [messages])

所以每当我调用setmsg(msg.concat(data))新数据作为数组的第一个元素添加并且前一个元素消失并且消息的 useEffect 钩子在每次渲染后也显示空数组

我也应该得到以前的数组元素，然后将它与新数据连接起来，但是每当我收到新消息时 msg 变量就是空的

标签： reactjssocket.io