为什么调用update更新Firebase Realtime Database会陷入无限循环

核心触发原因 #

• onValue是Firebase Realtime Database的持久化实时监听器：你调用它之后，它会完成两个动作：
  1. 立刻拉取一次监听路径下的当前数据，触发回调执行
  2. 持续监听该路径的所有数据变动，只要数据发生任何修改、新增、删除操作，都会再次拉取最新数据，触发回调执行
• 你把onValue写在表单提交的处理函数里，每次提交表单都会新增一个监听器，同时监听器回调内部执行的update(listsRef, updates)刚好修改了该监听路径下的数据，修改动作会反过来触发监听器回调再次执行，回调里又会执行update，最终形成无限循环。叠加每次提交新增的监听器，会让循环触发频率越来越高，快速导致程序崩溃。

为什么get()写法可以正常运行 #

get()是一次性数据读取接口：它只会发起一次请求拉取目标路径的当前数据，拿到结果后就结束整个读取逻辑，不会持续监听后续的数据变动。所以你在get的回调里执行update操作时，get的逻辑已经执行完成，不会被update的修改动作再次触发，自然不会形成循环。

额外优化建议 #

你当前的实现需要先拉取整个列表的全量数据再遍历匹配id，数据量较大时性能很差，你可以直接用查询接口定向匹配目标数据，不用全量拉取：

import { query, orderByChild, equalTo, get, update } from "firebase/database";

// 定向查询id匹配的节点
const contactQuery = query(listsRef, orderByChild('id'), equalTo(editContactId))
get(contactQuery).then(snapshot => {
  if (snapshot.exists()) {
    snapshot.forEach(childSnap => {
      update(childSnap.ref, updatedContact)
    })
  }
})

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