Как получить данные с firebase без перезагрузки страницы?

Question

ddnoob @ddnoob

Как получить данные с firebase без перезагрузки страницы?

Пытаюсь сделать на vue + vuetify регистрацию / авторизацию.

Vuex подключен.

Есть авторизация / регистрация на firebase (Realtime Database) через форму со странички (данные в базу заносит).

В папке store 3 файла:

1) index.js

export default new Vuex.Store({
  state: {
    error: null
  },
  mutations: {
    setError(state, error) {
      state.error = error
    },
    clearError(state) {
      state.error = null
    },

  },
  getters: {
    error: s => s.error
  },
  modules: {
    auth,
    info
  }
})

2) auth.js

actions: {
       async login({dispatch, commit}, {email, password}) {
           try {
            await firebase.auth().signInWithEmailAndPassword(email, password)
           } catch (e) {
            commit('setError', e)
            throw e
           }
       },

        getUid() {
            const user = firebase.auth().currentUser
            return user ? user.uid : null
        },

}

3) info.js

state: {
        info: {}
    },

    mutations: {
        setInfo(state, info) {
            state.info = info
        },
        clearInfo(state) {
            state.info = {}
        }
    },

    actions: {
        async fetchInfo({dispatch, commit}) {
            try {
                const uid = await dispatch('getUid')
                const info = (await firebase.database().ref(`/users/${uid}/info`).once('value')).val()
                commit('setInfo', info)
              } catch (e) {
        
              }
        }
    },
    getters: {
        info: s => s.info
}

В папке views в фале Login.vue

<v-form
    ref="form"
	@submit.prevent="submitAuth">
...

methods: {
    async submitAuth() {
    const formData = {
      email: this.email,
      password: this.password
    }
    try {
      await this.$store.dispatch('login', formData)
	  this.$router.push('/')
    } catch (e) {}
    },
},

Теперь хочу отобразить (имя) вошедшего пользователя, указываю в нужном месте {{name}}.

computed: {
  name() {
    return this.$store.getters.info.name
  }
},

Когда ввожу существующие данные в форму входа - все ок, заходит, но (имя) не отображается - как только перезагружу страничку (имя) появляется и далее когда по роутам перехожу все норм.

Можно ли в моем случае получить данные без перезагрузки?
Если возможно объясните пожалуйста наглядно что не так?