Пытаюсь сделать на 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
}
},
Когда ввожу существующие данные в форму входа - все ок, заходит, но (имя) не отображается - как только перезагружу страничку (имя) появляется и далее когда по роутам перехожу все норм.
Можно ли в моем случае получить данные без перезагрузки?
Если возможно объясните пожалуйста наглядно что не так?
Простой
