如何使用Vue.js从Firebase实时数据库读取数据

时间:2020-10-29 21:05:01

标签: javascript firebase vue.js firebase-realtime-database

我正在尝试console.log我的Firebase实时数据库中的文档,但目前在尝试时出现此错误:

[Vue警告]:创建的钩子中出现错误:“ TypeError:firebase__WEBPACK_IMPORTED_MODULE_2 __。default.database(...)。get不是函数”

如何控制台所有我的文档记录在数据库中?

这是我的尝试:

<script>
import firebase from "firebase";
const db = firebase.database();
export default {
  name: "Login",
  data() {
    return {
      user: {
        email: "",
        password: "",
      },
    };
  },
  methods: {
    userLogin() {
      firebase
        .auth()
        .signInWithEmailAndPassword(this.user.email, this.user.password)
        .then(() => {
          this.$router.push("/");
        })
        .catch((error) => {
          alert(error.message);
        });
    },
  },
  created() {
    firebase
      .database()
      .get()
      .then((snapshot) => {
        snapshot.forEach((doc) => {
          console.log(doc.data());
        });
      });
  },
};
</script>

1 个答案:

答案 0 :(得分:1)

如果您使用模块捆绑器,则应按documentation所示导入Firebase SDK。此语法适用于客户端SDK的8.0.0或更高版本:

import firebase from "firebase/app";
import "firebase/database";

对于以前的版本:

import * as firebase from "firebase/app";