无法在实时vue-firebase应用程序中读取数据

Question

我想使用firebase和vue-js创建一个实时应用程序。 但是，我无法从Firebase获取数据。 我已经将读写数据的规则设置为true。

这是我在组件中的代码：

import firebase from "firebase";

let config = {
  apiKey: ".....",
  authDomain: "....",
  databaseURL: "...",
  projectId: "...",
  storageBucket: "...",
  messagingSenderId: "...",
  appId: "..."
};

let app = firebase.initializeApp(config);
let db = firebase.database();
var ref = db.ref("products");

export default {
  name: "home",
  data() {
    return {
      products: []
    };
  },
  firebase: {
    products: ref
  }

请注意，我可以使用以下代码行创建数据： ref.push({ name: "nfdg", price: 145, details: "fkshfksf" });

请帮助我！我是新手。