如何使用ReactJS正确配置Firebase

时间:2016-07-27 00:41:36

标签: reactjs firebase

最近,我正在通过密切关注一些教程来学习React,但是我已经达到了我的Web应用程序卡住的程度,因为我没有正确设置ReactJS和Firebase之间的集成。这是我到目前为止所做的。

var React            =  require('react');
var ReactDOM         =  require('react-dom');
var ReactFire        =  require('reactfire');
var Firebase         =  require('firebase');
var FirebaseAPIKey   =  require('xxxx-xxxx');
var rootURL          =  'https://fiery-torch-xxxx.firebaseio.com/';

var App = React.createClass({

mixins : [ReactFire],

componentWillMount : function(){
this.bindAsObject(Firebase.initializeApp(rootURL +'items/'),'items',FirebaseAPIKey);
},

render: function() {    
return <h1>how are you doing? Are you okay?</h1>
  }
});

var element = React.createElement(App, {});
ReactDOM.render(element, document.querySelector('.container')); 

正如您所看到的,我使用的是带有ReactJS 15.2.0的FireBase 3.2.1版本,但每次运行此Web应用程序时,我最终都会收到错误消息,指出我的API密钥无效。任何人都可以提供我正确设置此集成的任何示例都将非常感激;)

1 个答案:

答案 0 :(得分:1)

您似乎尝试使用过时的2.x样式初始化SDK。现在正确的方法是:

var firebase = require('firebase');

var config = {
  apiKey: "apiKey",
  authDomain: "projectId.firebaseapp.com",
  databaseURL: "https://databaseName.firebaseio.com",
  storageBucket: "bucket.appspot.com",
};

firebase.initializeApp(config);
var ref = firebase.database().ref('items');

我建议您查看web getting started guide并从那里开始。