测试Ionic 4 Firebase CRUD代码报错：DatabaseSnapshot无toJSON属性

云上老周

2026-5-6

解决Ionic 4 Firebase CRUD中toJSON()不存在的TypeScript错误

你遇到的这个类型错误，本质是Firebase Realtime Database SDK版本更新后API发生了变化——较新的版本（尤其是v9及以上的模块化SDK）里，DatabaseSnapshot对象已经不再提供toJSON()方法了，TypeScript会严格校验类型，所以抛出了这个报错。

下面是两种针对性的修复方案，你可以根据自己的SDK版本选择：

方案1：适配v8及以下的命名空间SDK（旧写法兼容）

直接把toJSON()替换成Firebase官方推荐的val()方法，就能保持原有逻辑正常运行：

bookingRes.snapshotChanges().subscribe(res => {
  this.Bookings = [];
  res.forEach(item => {
    let a = item.payload.val(); // 替换toJSON()为val()
    a['$key'] = item.key;
    this.Bookings.push(a as Appointment);
  })
})

方案2：适配v9及以上的模块化SDK（最新版本标准写法）

如果你的项目已经升级到Firebase v9+的模块化API，建议调整为更符合新版本规范的写法：

// 先导入必要的Firebase模块
import { getDatabase, ref, onValue } from "firebase/database";

// 重构订阅逻辑
const db = getDatabase();
const bookingsRef = ref(db, '你的预订数据节点路径');

onValue(bookingsRef, (snapshot) => {
  this.Bookings = [];
  snapshot.forEach((childSnapshot) => {
    const childKey = childSnapshot.key;
    const childData = childSnapshot.val();
    this.Bookings.push({
      ...childData,
      $key: childKey
    } as Appointment);
  });
});