Firebase数据获取后无法更新外部变量的技术求助

咱们先拆解你代码里的几个核心问题，再一步步给出修复方案：

1. 异步操作的时序问题 #

Firebase的onAuthStateChanged和数据库的once("value")都是异步操作——你的userData()函数会在这些异步任务完成前就执行return语句，所以返回的nameOf和usernameOf必然是undefined，因为此时setData还没被调用。

2. 变量未初始化导致的错误 #

你只声明了var userInfo，但没有初始化为空对象。setData里直接给userInfo.name赋值时，userInfo还是undefined，会直接抛出Cannot set properties of undefined的错误。

3. 导出对象的逻辑错误 #

你导出的userInformation里，username: userData.usernameOf是笔误（应该是userData().usernameOf），但本质问题还是异步——即使修正笔误，这里也只会拿到异步操作完成前的初始值，完全达不到预期。

修正后的代码方案 #

我们用Promise来处理异步流程，确保数据获取完成后再返回结果，同时修复变量初始化问题：

import * as firebase from 'firebase';

// 把userData改成返回Promise的异步函数
async function userData() {
  return new Promise((resolve, reject) => {
    firebase.auth().onAuthStateChanged(async (user) => {
      if (!user) {
        // 如果没有用户，返回空数据或者reject
        resolve({ name: '', username: '' });
        return;
      }
      try {
        const snapshot = await firebase.database().ref('users/' + user.uid).once("value");
        const userData = snapshot.val();
        // 直接返回整理好的数据
        resolve({
          nameOf: userData.name,
          usernameOf: userData.username
        });
      } catch (error) {
        reject(error); // 处理数据库读取错误
      }
    });
  });
}

// 导出一个异步函数，外部调用时用async/await获取数据
export async function getUserInformation() {
  const userInfo = await userData();
  return {
    name: userInfo.nameOf,
    username: userInfo.usernameOf
  };
}

如何使用这个修正后的代码 #

在需要获取用户信息的地方，用async/await或者.then()来调用：

// 示例：在组件或其他模块中使用
import { getUserInformation } from './你的文件名';

async function loadUserInfo() {
  try {
    const userInfo = await getUserInformation();
    console.log('用户信息:', userInfo.name, userInfo.username);
    // 这里可以把userInfo赋值给你的外部变量/状态
  } catch (error) {
    console.error('获取用户信息失败:', error);
  }
}

// 调用函数
loadUserInfo();

关键改动说明 #

• 用Promise封装异步流程，确保只有当Firebase的认证和数据库读取都完成后，才返回用户数据。
• 直接在异步流程中处理数据，避免了setData函数里的作用域问题（原来的setData试图修改外部变量，但因为异步时序问题根本没机会正确执行）。
• 导出异步函数getUserInformation，让外部可以在合适的时机主动获取数据，而不是依赖静态导出的对象。

内容的提问来源于stack exchange，提问作者Sahand Shahriari