注销时取消订阅 Firestore 侦听器

Question

解释了这样做的直接方法here

但是我很难在 onAuthStateChanged 中触发取消订阅，它位于不同的 vuex 模块中

存储/user.js

...
  onAuthStateChanged({ commit, dispatch }, { authUser }) {
    if (!authUser) {
      commit('RESET_STORE')
      this.$router.push('/')
      return
    }
    commit('SET_AUTH_USER', { authUser })
    dispatch('database/getUserItems', null, { root: true })
    this.$router.push('/home')
  }
...

存储/database.js

...
getUserItems({ state, commit }, payload) {
    const unsubscribe = this.$fireStore
      .collection('useritems')
      .where('owner', '==', this.state.user.authUser.uid)
      .onSnapshot(
        (querySnapshot) => {
          querySnapshot.forEach(function(doc) {
          // STUFF
        },
        (error) => {
          console.log(error)
        }
      )
  },
...

用户注销时如何从user.js模块引用unsubscribe()（authUser undefined）？

Answer 1

我认为你可以将它保存在你的 Vuex state 树中并从那里调用它。

  state: {
    //....
    listenerUnsubscribe: null,
    //....
  },
  mutations: {
    //....
    SET_LISTENER_UNSUBSCRIBE(state, val) {
        state.listenerUnsubscribe = val;
    },
    RESET_STORE(state) {
        state.listenerUnsubscribe()
    }
    //....
  },
  actions: {
    //....
    getUserItems({ state, commit }, payload) {
        const unsubscribe = this.$fireStore
        .collection('useritems')
        .where('owner', '==', this.state.user.authUser.uid)
        .onSnapshot((querySnapshot) => {
            querySnapshot.forEach(function(doc) {
            // STUFF
            },
            (error) => {
            console.log(error)
            }
        );
        commit('SET_LISTENER_UNSUBSCRIBE', unsubscribe);
    },