javascript - 如何避免在 native react 中首次渲染或如何仅渲染获取数据避免一次未定义？

Question

我是新启动的 React Native 框架，我使用 useState 和 useEffect 从 api 获取数据并存储在 useStete 中。当我渲染或尝试从 api 获取数据时，在第一个日志/渲染时给我未定义的数据，并且它为我提供 API 的数据。第一个未定义给我带来了问题，所以我想避免第一次渲染来获取数据。我可以为 API 的获取数据提供直接第二次渲染。

所以我如何克服这里的未定义等待，直到给我获取数据或直接为我提供第二次渲染避免第一次渲染未定义。

我真的很感谢你的帮助，

提前致谢!

注意:我不想初始化 State 以避免未定义。

const [data, setData] = useState();
    useEffect(() => {
        fetch("https://jsonplaceholder.typicode.com/posts/5")
            .then((response) => response.json())
            .then((data) => setData(data))
            .catch((error) => console.error(error))
    }, []);


console.log(data);

输出:

Answer 1

我同意之前的所有答案，但我还会添加一个微调器或 skeleton组件，以表明某事正在发生。如果您根本不显示任何内容，用户可能会认为没有发生任何事情，并且应用程序会出现锯齿状/无响应。

(事实上，第一代 iPhone 的响应速度比 Android 同类产品更快，因为它有一个加载动画，这让用户感觉有事情正在发生，即使该过程花费的时间与 Android 上的一样长)