React Native 我不能在其他组件的上下文中获取值

b4lqfgs4  于 2023-03-09  发布在  React
关注(0)|答案(1)|浏览(130)

我现在开始使用react,我正在学习一门课程,但在上下文部分,我的没有给出相同的结果,因为它应该有人能帮助我吗,我的代码:
Context.jsx

import { useState,createContext } from "react";

export const Contexto = createContext([]);

export default function ContextoGlobal(props){
    const [usuario,setUsuario] = useState({
        nome:"",
        logado:false
    });

    return(
        <Contexto.Provider value={{usuario,setUsuario}}>
            {props.children}
        </Contexto.Provider>
    );
}

index.js

...
const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(
  <React.StrictMode>
    <ContextoGlobal>
      <App/>
    </ContextoGlobal>
  </React.StrictMode>
);
...

调用上下文

const Usuario= useContext(Contexto);
User=Usuario.usuario
setUser=Usuario.setUser
alert(Usuario.usuario.nome)
let sla=Usuario.usuario.nome

以获取上下文值 在这个人使用这个代码的过程中

const {user,setUser}= useContext(Context)

这样他就可以使用set函数和用户对象
当我尝试这样做时,它是未定义的,只允许以我展示的方式访问:

User=Usuario.usuario
setUser=Usuario.setUser
alert(Usuario.usuario.nome)

但这样我就不能使用setUser函数

8ehkhllq

8ehkhllq1#

在对象{}中,将usuariosetUsuario提供给上下文的value。可以按如下方式使用上下文:

const { usuario, setUsuario } = useContext(Contexto);

如果您console.log()您的上下文值,您将看到它是一个具有您设置的两个值的对象

const Usuario = useContext(Contexto);
console.log(Usuario);

// {
//   usuario: {
//     nome: "",
//     logado: false,
//   },
//   setUsuario: () => {}, // set state
// }

使用对象{}而不是数组[]来初始化内容值也是很好的,因为这是您要在Provider中设置的内容

export const Contexto = createContext({});

相关问题