Vue js 和 Firebase答案

【问题标题】：Vue js and FirebaseVue js 和 Firebase
【发布时间】：2020-05-14 18:32:27
【问题描述】：

我是 Vue Js 和 Firebase 的新手。我想学习 firebase /firestore db 连接，数据输入/输出，但我没有得到任何适当的文档或教程。请建议。

我正在使用 VUE CLI 2。

【问题讨论】：

这个问题可能会被关闭。您能否将问题的范围限制在您遇到的问题的更窄范围内？
我有一个关于codesandbox codesandbox.io/s/pedantic-fast-jy4lm94nv 的示例，这是我在技术面试中使用的一个版本。 firebase 连接正常（测试是添加更新测试等功能）。它的设置使得firebase.js 是可移植的并且与框架无关。我敢肯定有一些 vue 插件可以让它变得更容易，你有没有研究过？他们通常有很好的文档。
npmjs.com/package/vue-firestore

标签： vue.js

【解决方案1】：

创建一个 src/firebaseDb.js 文件，然后添加以下代码以在 vue 中使用您的 Firebase 配置详细信息建立实时数据库连接。

import * as firebase from 'firebase';

const firebaseConfig = {
    apiKey: "api-key",
    authDomain: "project-id.firebaseapp.com",
    databaseURL: "https://project-id.firebaseio.com",
    projectId: "project-id",
    storageBucket: "project-id.appspot.com",
    messagingSenderId: "sender-id",
    appId: "app-id",
    measurementId: "G-measurement-id"
}

const firebaseApp = firebase.initializeApp(firebaseConfig);

export const db = firebaseApp.firestore();

你可以很容易地检查这个链接 https://www.positronx.io/vue-js-firebase-build-vue-crud-app-with-cloud-firestore/

【讨论】：

欢迎提供解决方案链接，但请确保您的答案在没有它的情况下有用：add context around the link 这样您的其他用户就会知道它是什么以及为什么会出现，然后引用最相关的您链接到的页面的一部分，以防目标页面不可用。 Answers that are little more than a link may be deleted.

【解决方案2】：

我已经创建了 firebaseConfig.js 文件并连接到 fire store。

import firebase from 'firebase/app'
require('firebase/firestore');

// Initialize Firebase
var config = {
    apiKey: "AIzaSyC944Kh9T_Pcdn-kTZ6LywsIUATJBmQNTI",
    authDomain: "halo-care-38f05.firebaseapp.com",
    databaseURL: "https://halo-care-38f05.firebaseio.com",
    projectId: "halo-care-38f05",
    storageBucket: "halo-care-38f05.appspot.com",
    messagingSenderId: "682838402004"
};

const firestore =firebase.initializeApp(config);
const db = firebase.firestore();
export default db;

【讨论】：