如何高效读取Firestore文档引用字段内容？

场景说明 #

我使用Firestore设计了如下数据模型：

• pokemon集合：每个文档结构为{ name: string, move?: Ref<move> }
• moves集合：每个文档结构为{ name: string }

已录入2条pokemon数据：一条关联名为“growl”的move，另一条无move字段。目标是在Next.js客户端读取pokemon集合，构建数组，每个元素结构为{ name: string, move?: { name: string } }

初始代码问题 #

初始尝试用QuerySnapshot.forEach处理异步读取引用，但因为forEach不等待Promise解析，最终数组仅包含无引用的那条数据：

import firebase from "./{configfilepath}"

...

const db = getFirestore(firebase)
const pokemonRef = collection(db, "pokemon")
const pokemonQuery = query(pokemonRef)
const pokemonSnap = await getDocs(pokemonQuery)

...

const pokemon = []
pokemonSnap.forEach(async (doc) => {
  const docData = doc.data()
  const moveRef = docData.move
  const moveSnap = moveRef ? await getDoc(moveRef) : undefined
  const moveData = moveSnap ? moveSnap.data() : undefined

  pokemon.push({
    id: doc.id,
    name: docData.name,
    move: moveData,
  })
})

改进后的代码 #

改为先收集原始数据，再用Promise.all处理异步读取，虽然解决了问题，但代码过于繁琐：

...

const pokemonRaw = []

pokemonSnap.forEach((doc) => {
  pokemonRaw.push({
    id: doc.id,
    data: doc.data()
  })
})

const pokemon = await Promise.all(pokemonRaw.map(async (rawData) => {
  const moveRef = rawData.data.move
  const moveSnap = moveRef ? await getDoc(moveRef) : undefined
  const moveData = moveSnap ? moveSnap.data() : undefined

  return {
    id: rawData.id,
    name: rawData.data.name,
    move: moveData,
  }
}))

问题 #

1. 在客户端读取Firestore记录时，有没有更简洁、符合惯例的方式访问引用字段？
2. 在Firestore数据建模时，是否应该放弃使用引用字段？

解答 #

问题1：更简洁的引用字段读取方式 #

目前Firestore官方SDK没有自动解析引用字段的内置方法，但可以封装工具函数简化重复逻辑：

// 封装引用解析工具函数
async function resolveRef(ref) {
  if (!ref) return undefined
  const snap = await getDoc(ref)
  return snap.exists() ? snap.data() : undefined
}

// 简化后的读取逻辑
const pokemonSnap = await getDocs(query(collection(db, "pokemon")))
const pokemon = await Promise.all(
  pokemonSnap.docs.map(async (doc) => {
    const data = doc.data()
    return {
      id: doc.id,
      name: data.name,
      move: await resolveRef(data.move)
    }
  })
)

把重复的引用解析逻辑抽离后，代码会清爽很多。如果项目中频繁处理引用，也可以考虑封装成通用的hooks（比如结合React的useCallback），进一步简化组件内的代码。

问题2：是否要放弃引用字段？ #

不要轻易放弃引用字段，它有明确的适用场景：

• 当关联数据会被多个文档共享（比如多个宝可梦用同一个招式），引用能保证数据一致性——修改招式文档时，所有关联的宝可梦都会读取到最新数据，避免冗余数据同步问题。
• 当关联数据体积较大或更新频繁，用引用可以减少主文档的大小，避免单文档体积超限，也能减少不必要的数据传输。

但如果符合以下情况，可以考虑嵌入数据而非引用：

• 关联数据不会被共享，且体积极小（比如只有name字段），直接把招式名称嵌入宝可梦文档，读取时一次请求就能拿到所有数据，无需二次查询。
• 你需要强一致性的单次查询，不想处理异步解析引用的逻辑，且数据更新频率极低。

总结：你的场景中招式是可共享的小数据，两种方式都可行。如果后续招式可能增加字段、被更多宝可梦引用，建议保留引用；如果只是简单名称关联且不会变化，嵌入数据会更高效。

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