无法使用 displayName 读取用户名答案

【问题标题】：couldn't read the name of the user using displayName无法使用 displayName 读取用户名
【发布时间】：2021-07-28 10:51:14
【问题描述】：

我无法使用 user.displayName 读取当前登录的名称。它给了我一个错误Uncaught TypeError: Cannot read property 'displayName' of null

代码：

function App() {
  const [posts, setPosts] = useState([]);

  const [user] = useAuthState(auth);

  useEffect(() => {
    db.collection("posts").onSnapshot((snapshot) => {
      setPosts(
        snapshot.docs.map((doc) => ({
          id: doc.id,
          post: doc.data(),
        }))
      );
    });
  }, []);

  console.log(user.displayName);

通过控制台记录用户console.log(user)，我获得了有关当前用户的信息，但不能只选择用户名。

我只需要获取当前用户的名称。但是user.display 并没有像上面提到的那样工作。

【问题讨论】：

你可以尝试使用空检查console.log(user?.displayName);
你试过user && user.dislayName 还是user?.displayName

标签： reactjs firebase google-cloud-firestore firebase-authentication

【解决方案1】：

在您记录名称时，用户未定义。您可以使用 useEffect 挂钩订阅 [user] 变量并监听更改。

useEffect(() => {
    if(user){
        console.log(user.displayName)
    }
}, [user]);

【讨论】：

嘿，是的，实际上我在登录时得到了一个空用户。这个解决方案有效。但我会推荐 user?.displayName 。如果你可以格式化问题。我可以打勾，这样我也能帮助别人。