在React Native應用上檢索Firebase數據時出現問題

Question

我正在嘗試顯示已經存儲在Firebase RealTime數據庫中的WeightGoal，但是出現以下錯誤。 “對象作為React子對象無效（找到：帶有鍵{…}的對象）”

這是我的json文件：

這是我的componentWillMount代碼：

componentWillMount() {
  const { currentUser } = firebase.auth();
  firebase
    .database()
    .ref(`/users/${currentUser.uid}/goals`)
    .on('value', snap => {
      this.setState({ WeightGoal: snap.val()})
    })
}

這就是我在render中引用值的方式：

{this.state.WeightGoal}

我的期望是看到170顯示在屏幕上。

任何幫助將不勝感激。

Answer 1

snap.val()是由數據庫中的goal對象組成的對象，因為這就是您要引用的對象：

.ref(`/users/${currentUser.uid}/goals`)

因此，如果您只想存儲WeightGoal property ，則使用this.setState應如下所示：

this.setState({ WeightGoal: snap.val().WeightGoal })

PS下次嘗試將console.log（this.state）添加到render（）中，以查看正在顯示的內容。 或在Chrome調試器中添加斷點，這是一種更可靠的方法。