Состояние VUEX не загружается, если страница посещается напрямую - PullRequest
Новая
       6

Состояние VUEX не загружается, если страница посещается напрямую

0 голосов
/ 28 февраля 2020

У меня сейчас проблема с извлечением состояний в зависимости от страницы, на которой кто-то впервые заходит.

Сейчас я установил VUEX в «fetchUsers» из приложения. vue. Модуль VUEX выглядит так: 

import db from '@/firebase/init'

const state = {
  user: {
    loggedIn: false,
    data: null
  },
  userInfo: null
}

const getters = {
  user (state) {
    return state.user
  },
  userInfo (state) {
    return state.userInfo
  }
}

const actions = {
  fetchUser ({ commit }, user) {
    commit('SET_LOGGED_IN', user !== null)
    if (user) {
      commit('SET_USER', {
        email: user.email,
        uid: user.uid
      })
    } else {
      commit('SET_USER', null)
    }
  },
  fetchUserInfo ({ commit }) {
    if (state.user.loggedIn === true) {
      state.userInfo = null
      let userRef = null
      const ref = db.collection('Users')
        .where('user_id', '==', state.user.data.uid)
      ref.get().then(function (querySnapshot) {
        querySnapshot.forEach(function (doc) {
          userRef = doc.data()
          userRef.id = doc.id
        })
      }).then(() => {
        commit('SET_USER_INFO', userRef)
      })
    }
  }
}

const mutations = {
  SET_LOGGED_IN (state, value) {
    state.user.loggedIn = value
  },
  SET_USER (state, data) {
    state.user.data = data
  },
  SET_USER_INFO (state, userRef) {
    state.userInfo = userRef
  }
}

export default {
  state,
  getters,
  actions,
  mutations
}

И я инициализирую его в своей основной. js как таковой; 

firebase.auth().onAuthStateChanged(user => {
  store.dispatch('fetchUser', user).then(() => {
    store.dispatch('fetchUserInfo')
  })
})

Если пользователь заходит на мою домашнюю страницу, то идет в другом месте на сайте все играет красиво. Однако, если пользователь заходит, скажем, «страница проекта», он показывает «_vm.userInfo is null». (или / также это. $ store.getters.userInfo имеет значение null) Несмотря на то, что я использую mapGetter, как и на домашней странице, чтобы получить userInfo из магазина.

Что я делаю неправильно?

1 Ответ

0 голосов
/ 02 марта 2020

Когда пользователь посещает любую другую страницу, функция onAuthStateChanged вызывается firebase, и вы вызываете store.dispatch в функции onAuthStateChanged. Вы можете исправить это, используя правильную переменную store.

...