在过滤器数组上使用扩展运算符创建 Firestore 查询

Question

我正在为我的 React Web 应用程序开发一个过滤器组件，并希望返回（通过 props）一组用于 Firestore 查询的条件。

例如，如果用户想要过滤掉没有 cmets 的帖子，他们会选中一个复选框并将 where("commentsCount", ">", "0") 添加到过滤器数组中。

  const queryParams = [
    collection(db, "posts"),
    orderBy(sortType, sortMethod),
    limit(POSTS_PER_PAGE),
  ];
  const filters = [
    where("commentsCount", ">", "0"),
    // And possibly more where's
  ];
  queryParams.push(...filters);
  
  // Create a firestore query object using the parameters
  const _query = query(...queryParams);

但是这样做会给我一个 TypeScript 错误：A spread argument must either have a tuple type or be passed to a rest parameter. TS2556。

我做错了什么？

Answer 1

您不能在query 中传递(CollectionReference<DocumentData> | QueryConstraint)[] 类型的参数。尝试直接在query 中添加collection() 并将其从queryParams 中删除，这样它将是QueryContraint[] 类型的数组：

const queryParams = [
  orderBy(sortType, sortMethod),
  limit(POSTS_PER_PAGE),
];

const filters = [
  where("commentsCount", ">", "0"),
  // And possibly more where's
];
  
// Create a firestore query object using the parameters
const _query = query(collection(db, "posts"), ...queryParams);