You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Next.js/React项目使用useCollectionData时报v1.isEqual is not a function错误

报错触发原因
  • 依赖版本不兼容:该报错90%以上场景都是react-firebase-hooks和firebase SDK 版本不匹配导致。Firebase v9 开始改用模块化API,将isEqual方法从顶层导出调整为firebase/firestore 子路径导出,低于v5.0.0版本的react-firebase-hooks 还是按照旧路径调用该方法,就会抛出找不到方法的错误。
  • 入参类型错误:你传入useCollectionData的第一个参数renderPosts不是原生的Firestore CollectionReference或者Query实例。如果你对Firestore查询对象做了自定义包装、序列化,会导致钩子内部的字段对比逻辑调用isEqual时入参异常。
  • 依赖冲突:项目中存在多版本Firebase SDK共存,react-firebase-hooks调用时错误引用了没有导出isEqual方法的版本。
对应解决办法
  • 匹配依赖版本:如果你使用的是Firebase v9及以上版本,直接升级react-firebase-hooks到最新正式版即可,执行命令:
    npm install react-firebase-hooks@latest
  • 校验查询实例:确保renderPosts是通过Firebase官方提供的collection()、query()等原生API生成的查询实例,不要对该实例做额外的代理、序列化操作,正确的生成逻辑示例:
import { collection, query } from "firebase/firestore";
import { db } from "@/utils/firebase"; // 替换为你自己的Firebase初始化文件路径

// 生成原生查询实例
const renderPosts = query(collection(db, "posts"));
// 调用钩子
const [posts, loading, error] = useCollectionData<Post>(renderPosts, { idField: "id" });
  • 清理依赖缓存:如果版本匹配后还是报错,删除项目根目录的node_modules文件夹、package-lock.json/yarn.lock/pnpm-lock.yaml锁文件后重新执行npm install,消除多版本依赖共存问题。

内容的提问来源于stack exchange,提问作者la39zz

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.29 13:57:00