控制台日志显示值但 setState 不 [重复]答案

【问题标题】：Console log displaying values but setState not [duplicate]控制台日志显示值但 setState 不 [重复]
【发布时间】：2021-11-02 17:01:13
【问题描述】：

import React from 'react';

import { useState, useEffect, useContext } from 'react';
import { auth } from '../../utils/firebase';
import AuthContext from '../../contexts/AuthContext'

//Components
import Navbar from './Navbar';

function Dashboard() {
    const [email, setEmail] = useState("");
    const [uid, setUID] = useState();

      useEffect(() => {
        console.log(auth.currentUser["email"]);
        setEmail(auth.currentUser["email"]);
        console.log(email);
      }, []);

    return (
        <div>
            <Navbar />
            <h1>Dashboard</h1>
        </div>
    );
}

export default Dashboard;

您好，我正在尝试创建一个带有 react 的程序，我使用 firebase 登录用户。但是，当尝试从用户那里获取电子邮件和 uid 时，当我执行 console.log(auth.currentUser["email"]) 时，我能够显示数据 auth.currentUser["email"] 但是当我尝试设置状态 setEmail(auth.currentUser["email"]) 和 console.log(email) console.log 不显示任何内容，我不明白为什么？我需要访问电子邮件以从用户那里获取更多数据，所以提前谢谢你

【问题讨论】：

React 批量执行useEffect 你不会在这个渲染中看到电子邮件的变化。请将console.log 移到useEffect 之外，以查看下一次渲染中的变化????

标签： javascript reactjs firebase-authentication setstate console.log

【解决方案1】：

因为 state 只有在组件重新渲染时才有新值。所以你应该把 console.log 移到 useEffect 来检查组件重新渲染时的新值。

  useEffect(() => {
    console.log(auth.currentUser["email"]);
    setEmail(auth.currentUser["email"]);
  }, []);

useEffect(() => {
  console.log(email);
}, [email]);

【讨论】：

@Lara Calvo 将答案标记为已回答（如果正确）！