Блог

Я пытался прочитать состояние пользователей, когда получил сообщение от сокетио. Но когда я получил сообщение от socketio, состояние пользователей равно нулю.

У меня есть компонент под названием AddUser.js, этот компонент предназначен для добавления пользовательских значений в состояние пользователя.

Когда я использую chrome для инструментов разработки react, я вижу, что значение UsersState обновляется при добавлении нового пользователя. Но значение UsersState равно нулю внутри функции socketio emmit.

1. UsersContext.js

 export const UsersContext = createContext()

export const UsetsContextProvider = (props) => {
    const [ UsersState, setUsersState ] = useState(null)
    const { socket } = useContext(SocketContext)


    useEffect(() => {
        socket.onAny((eventName, data) => {

            console.log(UsersState) // always null, even I add new user using AddUser.js this console.log is always null

        })
    }, [])


    return (
        <UsersContext.Provider value = {{UsersState, setUsersState}}>
            {props.children} 
        </UsersContext.Provider>
    )

}
 

2. AddUser.js

 function AddUser(){

    const [newUser, setNewUser] = useState("")
    const {setUsers} = useContext(UsersContext)

    const handleSubmit = e => {
        e.preventDefault()
        setUsers(c => [...c, newUser])
    }

    return (
        <div>
            <form onSubmit={handleSubmit}>
                <input type="text" onChange={e => setNewUser(e.target.value)} />
            </form>
        </div>
    )
}