J'essaie d'afficher un nom d'utilisateur d'une base de données Firebase dans une fonction de retour React.
J'ai une fonction appelée getUserName
qui récupère le nom d'utilisateur de la base de données et le renvoie.
const getUserName = async () => { try { const docRef = doc(db, "users/" + auth.currentUser?.uid); const userDocument = await getDoc(docRef); const userData = userDocument.data() as UserData; const userName = userData.name.split(' ')[0]; return userName; } catch (error) { console.error(error) return "Failed to Retrieve UserName"; }; }
Ensuite, j'essaie de l'afficher dans le retour du composant React.
return ( <div> Hi, {getUserName()}! </div> )
Mais j'obtiens cette erreur :
类型“Promise
Je ne suis pas sûr de ce que je fais de mal ici. J'utilise TypeScript, dois-je donc spécifier le type quelque part ?
Le message d'erreur est très clair. Pour résoudre ce problème, vous pouvez modifier
getUserName
函数以使用useState
挂钩来存储用户名
et mettre à jour de manière asynchrone.