Question

作为序言，我才刚刚开始涉足React.js，因此解决方案可能很简单。

我正在将React.js与firebase和react-router一起用于具有表单的基本多页站点的文本形式。在TicketList页面上，我尝试将数据发布到Firebase，该方法可以正常工作，但是当我转到另一页面并返回到TicketList页面时，出现错误：{{1 }}。

在我所遵循的教程中，代码是相同的，只是我的所有TypeError: Cannot read property 'database' of undefined代码都在TicketList上，因为该教程没有react-router。不确定此结构是否与此问题有关。本教程在App.js中也没有this.app = firebase.initializeApp(DB_CONFIG);，但是如果没有这一点，我会得到错误：if (!firebase.apps.length)。

如果我将Firebase App named '[DEFAULT]' already exists放在this.database = this.app.database().ref().child('tickets');内，则会收到错误消息：if (!firebase.apps.length)，但现在我认为我偏离了原来的问题，而且我的理解已经偏离。有人对我有方向吗？谢谢！

结构：

TypeError: Cannot read property 'on' of undefined

TicketList.js：

src 
    > components 
    > config
      > config.js
    > routes
      > About.js
      > TicketList.js
      > index.js
    > App.js

Answer 1

问题在这里：

this.app = firebase.initializeApp(DB_CONFIG);
this.database = this.app.database().ref().child('tickets');

firebase.initialize是异步的，这就是为什么this.app在您引用它时仍未定义的原因。

相反，请尝试：

firebase.initializeApp(DB_CONFIG);
this.database = firebase.database().ref().child('tickets');

React / Firebase错误：无法读取未定义的属性“数据库”

1 个答案: