Estoy escribiendo la API de contexto y todo funciona bien, pero cuando envolví el componente de la aplicación con la pantalla de contexto quedó en blanco
Código de contexto
import { useState } from "react"; import { createContext, useContext } from "react"; const chatContext = createContext(); const ChatContext = ({ childern }) => { const [user, setuser] = useState(); return ( <chatContext.Provider value={{ user, setuser }}> {childern} </chatContext.Provider> ); }; export const ChatState = () => { return useContext(chatContext); }; export default ChatContext;código de index.js antes de envolver contexto
ReactDOM.render( <React.StrictMode> <Router> <App /> </Router> </React.StrictMode>, document.getElementById("root") );** código después de envolver la API de contexto **
import ChatContext from "./Context/ChatContext"; ReactDOM.render( <ChatContext> <Router> <App /> </Router> </ChatContext>, document.getElementById("root") );pero la pantalla se pone en blanco, alguien como me puede ayudar.
Traté de resolver este problema pero no puedo hacerlo. Por favor, alguien que pueda ayudarme se lo agradeceré.
creo que solo escribiste mal children, escribiste childern y si arreglas cómo lo escribiste, el problema se resolverá
const ChatContext = ({ *childern* children }) => { const [user, setuser] = useState(); return ( <chatContext.Provider value={{ user, setuser }}> {*childern* children} </chatContext.Provider> ); }; export const ChatState = () => { return useContext(chatContext); }; export default ChatContext;