时间戳

首页 > 解决方案 > 尝试将 firebase 配置导入我的 vue 文件

javascript - 尝试将 firebase 配置导入我的 vue 文件

问题描述

编辑：添加错误^^！https://i.imgur.com/72x6LQX.png

firebase.js?5b23:11 Uncaught TypeError: app.database is not a function
at eval (firebase.js?5b23:11)
at Object../src/components/firebase/firebase.js (app.js:3496)
at __webpack_require__ (app.js:679)
at fn (app.js:89)
at eval (selector.js?type=script&index=0!./src/components/front-end/Getstarted.vue:3)
at Object../node_modules/babel-loader/lib/index.js!./node_modules/vue-loader/lib/selector.js?type=script&index=0!./src/components/front-end/Getstarted.vue (app.js:2791)
at __webpack_require__ (app.js:679)
at fn (app.js:89)
at eval (Getstarted.vue?5f4d:1)
at Object../src/components/front-end/Getstarted.vue (app.js:3552)

所以我试图将firebase代码放在一个不同的文件中，而不是我使用它的.vue文件。如果我把它放在vue文件中，它确实像预期的那样工作，所以那里没有问题。但是我似乎无法弄清楚如何正确地做到这一点。

<script>
import Firebase, { functions } from 'firebase'
import conf from '../firebase/firebase'

let config = {
    apiKey: ''
    authDomain: ''
    databaseURL: ''
    projectId: ''
    storageBucket: ''
    messagingSenderId: ''
}

let app = Firebase.initializeApp(config)
let db = app.database()

let booksRef = db.ref('books')
(dashboard.Vue)

*这就是我的vue文件中的样子*

我有 2 个 javascript 文件，其中一个包含：

import config from './firebaseConfig'

class Firebase {
  constructor () {
    firebase.initializeApp(config)
  }
}

let db = app.database()

let booksRef = db.ref('books')

export default Firebase()
(firebase.js)

和一个：

let config = {
  apiKey: '',
  authDomain: '',
  databaseURL: '',
  projectId: '',
  storageBucket: '',
  messagingSenderId: '',
  appId: ''
}

export default (config)
(firebaseConfig.js)

我的文件夹结构如下所示：

components
|firebase
||firebase.js
||firebaseConfig.js
|backend
||Dashboard.vue

当我加载网页时，它只是一个空白页。想知道如何正确构建它，如果有任何不清楚的地方，请告诉我

标签： javascriptfirebasevue.js

解决方案

在下面的行中，您没有声明 variable app，所以它是undefined

let db = app.database()

您可以更改firebase.js为

import firebase from 'firebase'
import config from './firebaseConfig'

const app = firebase.initializeApp(config)
let db = app.database()

export default db

并从您的组件中

import db from './firebase.js'
let booksRef = db.ref('books')
...

推荐阅读