React-native And Firebase: Wait For Firebase Data

I am currently implementing an application which relies on Firebase data before it can continue. However, I often (unless I deliberately wait) get the result Cannot read property [

Solution 1:

For convenience using promises over callbacks is preferred for this situation. You need to return a promise in downloadBikeObj.

downloadBikeObj() {
    returnFb.staticBikes
      .child(String(this.bookedBikeNo))
      .once('value')
      .then(bikeObj => {
        this.bikeObj = bikeObj.val;
        console.log("Save object is: ");
        console.log(this.bikeObj);
      }); // return promise
}

And compose over the returned promise in bookInterestedBike.

bookInterestedBike() {
    this.bookedBikeNo = this.interestBikeNo;

    this.downloadBikeObj()
        .then(() => this.updateBikeDataStartRide())
        .then(() => this.updateUserDataStartRide())
        .then(() => this.startTimer());    
}

Reference:

https://firebase.googleblog.com/2016/01/keeping-our-promises-and-callbacks_76.html