用户首次登录时集合的实时绑定不起作用(Vue.js、Vuexfire、Firebase)

用户首次登录时集合的实时绑定不起作用(Vue.js、Vuexfire、Firebase),firebase,vue.js,google-cloud-firestore,vuexfire,Firebase,Vue.js,Google Cloud Firestore,Vuexfire,我正在开发一个通知系统,我遇到了Vuexfire,以便在通知集合和表之间进行实时绑定。 到目前为止,问题是: 我可以同时向用户和组发送通知,如果选择了用户和组,则会出现重复的通知。。。如果通知同时发送给用户和组,如何消除重复通知? 我当前的解决方案98%的时间都能正常工作,但在用户登录组后,通知不会显示,除非我刷新或在系统中执行某些操作并返回 我在每个文档中都有一个userid和groupid数组,用于存储用户或组的ID。 然后我做了两个绑定,如下所示,在我的vuex存储主文件中 Vue.use

我正在开发一个通知系统,我遇到了Vuexfire,以便在通知集合和表之间进行实时绑定。 到目前为止,问题是: 我可以同时向用户和组发送通知,如果选择了用户和组,则会出现重复的通知。。。如果通知同时发送给用户和组,如何消除重复通知? 我当前的解决方案98%的时间都能正常工作,但在用户登录组后,通知不会显示,除非我刷新或在系统中执行某些操作并返回

我在每个文档中都有一个userid和groupid数组,用于存储用户或组的ID。 然后我做了两个绑定,如下所示,在我的vuex存储主文件中

Vue.use(Vuex)

export const store = new Vuex.Store({
  modules: { auth, groups, clients, users, erp, serviceOrders, general, notifications, productivity, management, setup, calendar},
  plugins: [
    createPersistedState({
      storage: window.sessionStorage,
      paths: ['auth.isAuthenticated', 'auth.userName', 'auth.userGroup', 'auth.user.email', 'auth.user.uid', 'auth.sessionStart', 'general.links', 'serviceOrders']
    })
  ],

  state: {
    newNotificationsUser: [],
    newNotificationsGroup: []

  },
  mutations: {
  ...vuexfireMutations
  },
  actions: {
    getNotificationsToUser: firestoreAction(({ bindFirestoreRef, state }) => {
       bindFirestoreRef('newNotificationsUser', db.collection('notifications')
      .where("userIds", "array-contains", state.auth.user.uid)) 
    }),
    getNotificationsToGroup: firestoreAction(({ bindFirestoreRef, state }) => {
      bindFirestoreRef('newNotificationsGroup', db.collection('notifications')
      .where("groupIds", "array-contains", state.auth.userGroup))
    })
  },
  getters: {

  }
})
我获取通知并将其存储在newNotificationsUser和newNotificationsGroup中

在我的组件中,我有如下内容:

computed: {
    ...mapState({ uniqueNotifications: function(state){
      return Array.from(new Set (state.newNotificationsUser.concat(state.newNotificationsGroup)
      .map(e => JSON.stringify(e))))
      .map(e => JSON.parse(e))
    }
    }),
   },

methods: {
     ...mapActions( ['getNotificationsToUser', 'getNotificationsToGroup']),
}

我连接两个数组,然后删除重复项,并在uniqueNotifications变量中显示结果。 问题是,在第一次登录时,它不会加载组部分,只有在我导航到另一个页面并返回,或者收到将填充该页面的新通知后才会加载

我已尝试将已安装的挂钩更改为created和beforeMount,但没有效果。 我认为问题在于concat方法。。。 有没有办法在不完全改变实现方式的情况下解决这个问题

只是一些图片来说明我所说的: 登录并重定向到主页后,通知组件位于:

然后在刷新或其他任何操作之后,它就可以工作了

提前谢谢

mounted(){
    this.getNotificationsToUser()
    this.getNotificationsToGroup()

  }