React 18中如何合并Firebase Firestore V9多个查询的结果？

可行的方法主要有两种，你可以根据现有数据结构和性能需求选择：

方法一：并行查询后合并去重 #

Firestore不支持跨不同字段的OR查询，所以可以同时执行三个独立查询，拿到结果后合并并去重（避免同一个用户因满足多个条件被重复返回）。

代码示例：

import { getDocs, query, collection, where } from "firebase/firestore";

async function getCombinedResults(search) {
  // 定义三个查询
  const q1 = query(collection(db, "users"), where("username", "==", search));
  const q2 = query(collection(db, "users"), where("CurrentCity", "==", search));
  const q3 = query(collection(db, "users"), where("HomeTown", "==", search));

  // 并行执行所有查询
  const [snapshot1, snapshot2, snapshot3] = await Promise.all([
    getDocs(q1),
    getDocs(q2),
    getDocs(q3),
  ]);

  // 将所有文档转换为带id的对象数组
  const results = [
    ...snapshot1.docs.map(doc => ({ id: doc.id, ...doc.data() })),
    ...snapshot2.docs.map(doc => ({ id: doc.id, ...doc.data() })),
    ...snapshot3.docs.map(doc => ({ id: doc.id, ...doc.data() })),
  ];

  // 根据id去重，保留第一个出现的实例
  const uniqueResults = Array.from(new Map(results.map(item => [item.id, item])).values());

  return uniqueResults;
}

这种方法不需要修改现有数据结构，但如果用户量较大，三次查询会产生三次读操作，开销相对更高。

方法二：重构数据结构实现单查询 #

如果可以修改用户数据结构，推荐这种更高效的方式：给每个用户文档添加一个数组字段（比如searchableValues），把username、CurrentCity、HomeTown的值存入该数组，然后用array-contains查询一次就能拿到所有匹配结果。

步骤1：更新用户数据结构 #

import { doc, updateDoc } from "firebase/firestore";

// 示例：更新单个用户的可搜索字段
async function updateUserSearchableFields(userId, username, currentCity, homeTown) {
  const userRef = doc(db, "users", userId);
  await updateDoc(userRef, {
    searchableValues: [username, currentCity, homeTown]
  });
}

注意：后续用户修改用户名、城市等信息时，需要同步更新searchableValues数组，保证数据一致性。

步骤2：创建复合索引 #

首次执行查询时，Firestore控制台会提示你创建对应的数组索引，直接点击提示链接即可自动生成。

步骤3：单查询获取结果 #

import { getDocs, query, collection, where } from "firebase/firestore";

async function getCombinedResults(search) {
  const q = query(
    collection(db, "users"),
    where("searchableValues", "array-contains", search)
  );

  const snapshot = await getDocs(q);
  const results = snapshot.docs.map(doc => ({ id: doc.id, ...doc.data() }));
  
  return results;
}

这种方法仅需一次读操作，性能更优，但需要修改现有数据结构并维护字段一致性。

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