Webpack打包后getTable函数调用返回undefined问题求助

你的问题核心在于异步操作的处理逻辑错误：getTable返回的是Promise异步对象，而非直接的结果值；同时原函数的.then回调未返回数据，导致Promise最终resolve的是undefined。

第一步：修复getTable函数 #

修改函数，确保Promise最终返回实际的快照值（或默认值）：

function getTable(tname, trowid) {
  return get(ref(db, `table_name/${tname}/table_row_${String("0" + trowid).slice(-2)}`)).then((snapshot) => {
    if (snapshot.exists()) {
      const value = snapshot.val();
      console.log(value);
      return value; // 关键：返回实际值，让Promise resolve这个结果
    }
    return null; // 快照不存在时返回默认值，避免Promise返回undefined
  });
}
window.getTable = getTable;

第二步：正确调用异步函数 #

不能直接将Promise赋值给DOM元素的value，需通过async/await或.then处理异步结果：

方式1：使用async/await（推荐，代码更清晰） #

// 将调用逻辑包裹在async函数中
async function loadTableData(tname) {
  // 用let声明i，避免循环异步中的变量污染
  for (let i = 0; i < 69; i++) {
    try {
      const value = await window.getTable(tname, i);
      const element = document.getElementById(i);
      if (element) {
        element.value = value || ''; // 处理null/undefined的情况
      }
    } catch (err) {
      console.error(`加载第${i}行数据失败:`, err);
    }
  }
}

// 执行加载函数
loadTableData(tname);

方式2：使用.then链式调用（兼容旧环境） #

function loadTableData(tname) {
  // 用数组遍历避免循环变量问题
  Array.from({length: 69}, (_, i) => i).forEach((i) => {
    window.getTable(tname, i)
      .then(value => {
        const element = document.getElementById(i);
        if (element) {
          element.value = value || '';
        }
      })
      .catch(err => console.error(`加载第${i}行数据失败:`, err));
  });
}

loadTableData(tname);

为什么之前的方法无效？ #

1. 直接赋值document.getElementById(i).value = window.getTable(...)得到的是Promise对象，而非异步请求返回的实际值，因此显示undefined。
2. 原函数的.then回调未返回snapshot.val()，导致Promise最终的resolve结果为undefined，即便用await也拿不到有效数据。

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