Vuex 状态与 Firebase 同步



我遵循一些准则,让我的 Vue.js 状态与 Firebase 同步。我已经在单独的文件夹存储中设置了对 Firebase 和 getter、突变和 vue 中的操作的引用。当我在没有 Firebase 连接(本地(的情况下更新状态时,它似乎有效,当我仅使用 Firebasereference 和推送从其他组件更新 Firebase 时,它也可以工作 - 然后同步似乎有效。我的问题是我是否应该更新状态抛出"动作/突变",突变将推动状态数组,并且以神奇的方式,Firebase 将更新,这在我的情况下不会发生。

那么 - 如何更新?从使用引用的组件,例如dbOrdersRef.push(order(或调用存储,例如this.$store.dispatch('setOrder',order(,它不会更新Firebase(但其他局部变量更新(。

我认为方案应该是这样的:

您应该以某种方式订阅Firebase更新(我不熟悉Firebase,但我确信应该有一些机制(以及当更新来自Firebase时 - 您应该通过调度一些操作来改变您的商店,以保持您的存储与Firebase同步。

理想情况下,您的应用应仅适用于您的商店。商店应隐藏诸如 Firebase 使用情况之类的实现详细信息。如果明天你要从Firebase切换到其他东西,你不应该重写与商店一起工作的组件。他们仍将与商店和相同的操作合作。

当您更新商店中的某些内容时,您还需要更新Firebase。我认为你可以在行动中做对,应该没问题。这样,您可以确保商店中显示的所有更改都将在Firebase中。例如,您调用实际上进行一些火力基础操纵的someAction。如果您订阅了 firebase 更改,除了为 firebase 发送一些命令外,您甚至不会在该操作中执行其他操作,因为您的订阅会更新您的商店。或者您可以立即更改商店(也称为乐观更新(,然后等待Firebase的响应,然后决定离开该更新或调用某些突变进行回滚(但是在这里您应该非常小心,因为订阅了Firebase更改(。

或者,您也可以为商店编写一些插件,仅当商店中进行了一些更改后,该插件才会向Firebase发送更新。在这种情况下,来自您应用的更新首先会显示在您的商店本地,然后您的插件会将它们发送到 firebase(也许这样的插件甚至已经存在,idk(。

我不是Firebase的专家,但试图分享一些关于它应该如何工作的想法。希望这有帮助。

哦,回到你的问题:

dbOrdersRef.push(order( 或调用商店,例如 this.$store.dispatch('setOrder', order(,它不会更新 Firebase

我认为您根本不应该在组件中使用Firebase,而应该使用您的商店。所以我宁愿建议使用第二个选项。但是你应该自己实现Firebase更新,默认情况下,从商店到Firebase没有魔法更新(至少如果你没有使用一些具有这种魔法的插件(。

最新更新