开发者问题收集

自定义钩子获取未定义的值,然后在 React Native 中获取正确的对象?

2020-09-13
2014

您好,我正在尝试创建一个自定义钩子,从数据库中获取我的用户对象并使用它,但是我的控制台日志显示对象出现后不久对象未定义,这会影响依赖于它的其他函数,它们仅捕获第一个状态并给出错误我该如何修复这是我的钩子代码:-

import { useState, useEffect } from 'react'
import { storage, auth, database } from '../api/auth';



export default function useUser() {
    const [user, setUser] = useState()
    const userId = auth.currentUser.uid;

    useEffect(() => {
        getCurrentUser();

    }, [])


    const getCurrentUser = () => {
        database.ref("users/" + userId).orderByChild('name').once("value").then(snapshot => {
            setUser(snapshot.val())
        })
    }

    return user
}
1个回答

首先,您可以为 userObject 分配默认值。

const [user, setUser] = useState(null);

在使用 useUser 钩子之后,您可以检查它是否为空。

const user = useUser();


if (!user) {
    return <Text>Loading...</Text>;
}

return(
    <Text>{user.name}</Text>
);
Sergej Klackovskis
2020-09-13