时间戳

首页 > 解决方案 > useState() 具有初始值但未反映在状态变量中的钩子

react-native - useState() 具有初始值但未反映在状态变量中的钩子

问题描述

我有一个对象myObj，它是一个data对象领域。我使用useState钩子来启动这个对象的状态变量。

myObj就像{"name": "John", "age": 20, ...}。

import React, {useState} from 'react';

const myComponent = ({data}) => {
   const[student, setStudent] = useState(data.myObj); // myObj is a object with value
    
    console.log(`${JSON.stringfy(student)}`); // it prints undefined, why?


    return (
        // here I need to render the student information but it is undefined.
     )
}

我在这里误用了useState钩子吗？如果是这样，我怎样才能在 useState 钩子之后立即反映初始对象值，就像上面的控制台日志中显示的那样？

标签： react-nativereact-hooksuse-state

解决方案

据我所知，您的状态student没有得到刷新。如果是这样，你必须使用useEffect钩子。

怎么看？

useEffect(() => {
    console.log(`${JSON.stringfy(student)}`);
}, [student])

在您的情况下，您使用的是student外部return块，这就是控制台没有被打印的原因。一旦成功存储，使用useEffect您将获得更新。

如果控制台对您来说不重要，那么您可以直接打印学生的值而不使用useEffect,

return (
    <View>
        <Text>{student}</Text>
    </View>
)

推荐阅读