2016-07-27 178 views
0

最近,我通过密切关注一些教程学习了React,但由于我没有正确设置ReactJS和Firebase之间的集成,所以我的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')); 

正如你所看到的,我使用的火力3.2.1的版本15.2.0 ReactJS但我每次运行这个web应用程序我结束了,说我的API密钥无效的错误。任何人都可以向我提供正确设置该集成将大大赞赏任何例子)

回答

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考虑看看,并从那里去。

+0

你如何避免被加载不止一次?....我面对这个问题 http://stackoverflow.com/questions/39736739/reactjs-app-authentication-firebasefirebaseui-uncaught-error-firebase -app-南 – Juan