我有一个 vue 项目,以 firestore 作为数据库。我曾经使用以下功能登录用户:
loginUser(){
if(this.email && this.password){
firebase.auth().signInWithEmailAndPassword(this.email, this.password).then(() => {
this.$router.push({name: 'Index'})
}).catch(err => {
alert(err.message)
})
} else {
this.feedback = 'Please enter email & password.'
}
}
我编译并运行了这段代码,它运行良好。然后根据控制台日志的建议,我改变了
import firebase from 'firebase'
to
import firebase from 'firebase/app'
import 'firebase/auth'
从那时起,我观察到了一种最奇怪的行为。即使我注释掉代码this.$router.push({name: 'Index'})
,它仍然会在登录时将我重定向到索引页面。我不知道该怎么办。虽然,最终我想在用户登录时将其发送到索引页面,但如果代码被注释掉,它应该不起作用!我可能做错了什么?
火力地堡配置:
import firebase from 'firebase'
var firebaseConfig = {
apiKey: "...",
authDomain: "...",
databaseURL: "...",
projectId: "...",
storageBucket: "...",
messagingSenderId: "...",
appId: "...",
measurementId: "..."
};
// Initialize Firebase
const firebaseApp = firebase.initializeApp(firebaseConfig);
export default firebaseApp.firestore()
路由器/index.js:
import Vue from 'vue'
import VueRouter from 'vue-router'
import Index from '@/components/Index'
import Login from '@/components/Login'
import Signup from '@/components/Signup'
import firebase from 'firebase'
Vue.use(VueRouter)
const routes = [
{
path: '/',
name: 'Index',
component: Index,
meta: {
requiresAuth: true
}
},
{
path: '/login',
name: 'Login',
component: Login
},
{
path: '/register',
name: 'Signup',
component: Signup,
meta: {
requiresAuth: true
}
}
]
const router = new VueRouter({
mode: 'history',
base: process.env.BASE_URL,
routes
})
router.beforeEach((to, from, next) => {
if(to.matched.some(rec => rec.meta.requiresAuth)){
firebase.auth().onAuthStateChanged(user => {
if(user){
next()
} else {
next({name: 'Login'})
}
})
} else {
next()
}
})
export default router
我刚刚从import firebase from 'firebase/app'
to
import firebase from 'firebase'