ReactFire未从实时数据库加载数据

Question

我有一个Firebase项目，它有一个实时数据库，其中包含一些测试项目，结构如下：

project-21093
|_items
  |_item1
    |_name: "Name"
    |_category: "Category"
  |_item2
    |_name: "Name2"
    |_category: "Category:

我的index.html文件包含<script src="https://www.gstatic.com/firebasejs/3.3.0/firebase.js"></script>标记，这是我的index.js：

​

import React from 'react';
import ReactDOM from 'react-dom';
import firebase from 'firebase/app';
require("firebase/auth");
require("firebase/database");
import ReactFireMixin from 'reactfire';
require("./styles/customisations.scss");

// Initialize Firebase
var config = {
  apiKey: "key",
  authDomain: "auth",
  databaseURL: "url",
  storageBucket: "storage",
};
firebase.initializeApp(config);

var App = React.createClass({
  mixins: [ReactFireMixin],

  getInitialState: function() {
    return {
      items: []
    };
  },

  componentWillMount: function() {
    var fireRef = firebase.database().ref("items");
    this.bindAsArray(fireRef, "items");
  },

  render: function() {}
})

​

整个config部分都是直接取自项目页面给我的内容。它不能按照指示在index.html中工作，所以我在这里加载了它。我不确定到底需要哪些需求，所以我加载了一大堆。

我的问题是，尽管我的实时数据库中有一些项，但this.state.items始终是空的，我认为这些项应该绑定到componentWillMount中的this.state.items数组。因为文档从来没有指定需要传递给firebase.database().ref()调用的参数，所以我尝试了从project/items、project-21093/items和variations到database/data/items的所有方法，但都没有成功。Chrome dev工具的React插件清楚地显示了空数组。要成功加载此数据，我会遗漏什么？

Answer 1

原来，在“实时数据库”选项卡的“规则”部分，我需要稍微修改一下规则：

​

{
  "rules": {
    ".read": true,
    ".write": "auth != null"
  }
}

​

当.read设置为"auth != null"时，我无法访问任何内容，将其更改为true最终可以让我获得数据。在任何创业文档中都没有提到这一点，所以直到我看到this Firecast video，我才知道该怎么做。我仍然不确定如何配置它才能正确使用web，但至少我现在可以使用一些数据来制作我的应用程序。