尝试实现firebase身份验证,登录,登录,注销正在工作,因此如果用户登录或未登录,则尝试返回。
我商店的用户 ID 在尝试显示时返回为未定义/未更新。
签入 vue 开发工具时,用户 ID 永远不会改变。
它没有像未定义一样在我的控制台中记录为错误。在带有灰色文本颜色的单行中
<template>
<div>
<button @click="log"></button>
</div>
</template>
<script>
import firebase from 'firebase'
import { mapState } from 'vuex'
export default {
name: 'Navigation',
data () {
return {
}
},
computed: {
...mapState({
userId: state => state.userId
})
},
methods: {
loggedOut() {
this.$store.dispatch('logout')
},
log() {
console.log(this.$store.userId)
}
}
}
</script>
^this is my vue file
import Vue from 'vue'
import Vuex from 'vuex'
import db from '../firebase'
import router from '../router';
// import firebase from '../firebase'
import firebase from 'firebase'
//https://github.com/robinvdvleuten/vuex-persistedstate
Vue.use(Vuex)
import createPersistedState from "vuex-persistedstate"
export const store = new Vuex.Store({
plugins: [createPersistedState()],
state: {
userId: ''
},
mutations: {
LOGOUT(state, userId) {
state.userId = '';
},
SET_USER_ID(state, userId) {
state.userId = userId;
}
},
actions: {
checkUserStatus({ commit, state }) {
return new Promise((resolve, reject) => {
firebase.auth().onAuthStateChanged((user) => {
if (user) {
commit('SET_USER_ID', user.uid);
resolve(user.uid);
} else {
reject('User is not logged in.');
}
})
})
},
signIn(context, credentials) {
firebase.auth().createUserWithEmailAndPassword(credentials.username, credentials.password)
.then(data => {
router.push('/')
alert('Signed in!')
})
.catch(e => {
alert(e.message)
})
},
login(context, credentials) {
firebase.auth().signInWithEmailAndPassword(credentials.username, credentials.password)
.then(data => {
router.push('/')
alert('Logged inn')
})
.catch(e => {
console.log(e, ' Loggin failed')
alert(e.message)
})
},
logout(context) {
firebase.auth().signOut()
.then(data => {
router.push('/Login')
alert('logged out')
})
.catch(e => {
alert(e.message)
})
},
...
}
})
export default store