如何在 React-Native 應用程序中處理對 Firebase 的異步調用？

Question

我目前正在嘗試將應用程序的初始狀態設置為從 Firebase 提取的值。 但是，我無法弄清楚如何正確處理 Javascript 的異步性質——目前，當我在render函數中獲取應用程序的狀態時， itemsList未定義。 對我做錯的任何建議將不勝感激。

  getInitialState: function() {

    var dataSource = new ListView.DataSource({
        rowHasChanged: (r1, r2) => r1.guid != r2.guid,
        sectionHeaderHasChanged: (s1, s2) => s1 !== s2
    });

    return {
        dataSource: dataSource,
        itemsList: this.getItemsList()
    };
},

getItemsList: function() {
    var userRef = usersRef.child("5019e705-0-29f09e520b7e");
    var itemsListRef = userRef.child("items_list");
    var itemsList;

    itemsListRef.on('value', (snap) => {
        itemsList = snap.val();
        return itemsList;     
    });
},

Answer 1

您將需要使用 React 生命周期方法之一來處理異步調用：

在此處查看文檔

  componentDidMount: function() {
    this.serverRequest = $.get(this.props.source, function (result) {
      var lastGist = result[0];
      this.setState({
        username: lastGist.owner.login,
        lastGistUrl: lastGist.html_url
      });
    }.bind(this));
  },