Vue和Firebase:数据意外复制状态

时间:2020-08-27 09:41:05

标签: javascript firebase vue.js google-cloud-firestore state

我有两个对Firebase的调用:一个用于获取现有数据,另一个用于侦听数据中的更新。当这些更新发生时,由于某种原因而不是替换现有数据,我看到将两个数据集加在一起。无法确定原因,因为我在第二个函数中直接用新数据更新状态。

以下是在Mounted()上调用的函数:

log_id

以及有问题的两个功能

_id

1 个答案:

答案 0 :(得分:1)

在没有彻底测试代码的情况下很难准确地告诉您正在发生的事情,但是必须注意,两个调用(对getImages()refreshImages()的调用可能无法按照您期望的顺序进行。 / p>

由于您在getImages()中将数据推送picturesData,并且在refreshImages()中您替换了 picturesData,怀疑通过refreshImages()设置的侦听器在获得getImages()触发的查询结果之前返回了数据。


实际上,由于onSnapshot()会触发返回查询的整个结果的初始调用,因此您只需要调用refreshImages()(不需要初始调用到getImages())。


请注意,onSnapshot()不是像get()这样的异步方法,因此您无需使refreshImages()异步。