'firebase' 未定义 - Vue.js
2018-06-18
2498
我正在使用 firebase 登录用户,但控制台抱怨 firebase 未定义。 我正在导入 firebase,我已根据 firebase 提供的文档正确设置了配置,但仍然没有成功。
import Vue from 'vue'
import App from './App.vue'
import VeeValidate from 'vee-validate';
import router from './router';
import firebase from 'firebase';
Vue.use(VeeValidate);
Vue.config.productionTip = false
// Initialize Firebase
var config = {
apiKey: "<my api key>",
authDomain: "<my auth domain>",
databaseURL: "<my database url>",
projectId: "todo-bb5d3",
storageBucket: "",
messagingSenderId: "638496899966"
};
firebase.initializeApp(config);
new Vue({
router,
render: h => h(App)
}).$mount('#app')
导致问题的文件:
<template>
<div class="LogIn">
<h3>Sign Up</h3>
<input type="email" v-model="email" placeholder="email" name="" value="">
<input type="passeord" v-model="password" placeholder="password" name="" value="">
<button v-on:click="signUp" type="button" name="button">Sign Up</button>
</div>
</template>
<script>
export default{
name: 'LogIn',
data: function() {
return{
email: '',
password: ''
}
},
methods: {
signUp: function(){
firebase.auth().createUserWithEmailAndPassword(this.email, this.password).then(
function(user){
alert('Your account has been created')
},
function(err) {
alert('Opps! ' + err.message)
}
)
}
}
}
</script>
2个回答
您必须在“导致问题的文件中”导入 firebase。
import firebase from 'firebase';
另外,在这里粘贴您的 api 密钥也不是一个好主意,即使是对于测试应用程序,我也建议您编辑您的帖子并删除它。
8bit
2018-06-18
一种解决方案是在
created
实例生命周期钩子内按如下方式初始化它:
new Vue({
router,
render: h => h(App),
created() {
firebase.initializeApp(
{
apiKey: "...",
authDomain: "....",
databaseURL: "..."
...
}
)
}
}).$mount('#app')
Renaud Tarnec
2018-06-18