React+Firestore开发时嵌套集合新增文档立即被删除问题求助

• 核心错误出现在handleUnwatch方法的实现中，你误用了onSnapshot实时监听器来执行删除逻辑，而非一次性查询接口get()。
• onSnapshot会持续监听匹配查询条件的数据集变动，只要有符合watchedUserId == 传入id的文档新增、更新，都会自动触发回调执行删除操作。
• 步骤2调用handleUnwatch删除用户X时，注册的实时监听器没有被销毁，一直处于生效状态。步骤3重新添加同ID的用户X到嵌套集合时，刚好触发了这个残留的监听器，因此文档被立即删除，对应控制台的闪烁效果。

该问题和Firestore缓存机制没有关联，完全是实时监听器的使用场景错误、且未及时销毁残留监听器导致的逻辑异常。

将handleUnwatch中的onSnapshot替换为一次性查询接口get()即可：

const handleUnwatch = (id) => {
        db.collection("profiles")
            .doc(myProfile.id)
            .collection("watched")
            .where("watchedUserId", "==", id)
            .get()
            .then(snapshot => snapshot.forEach(it => it.ref.delete()));
    }

如果业务场景确实需要使用onSnapshot实时监听数据变动，一定要在不需要监听时调用onSnapshot返回的取消函数销毁监听器，避免出现内存泄漏和意外的业务逻辑异常。

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