Passing an array to another function in ReactJS

Question

Simpleish react question that is evading me for a second:

  readData: function(){
    var readFromCpDev1 = firebase.database().ref('environments/' + 'cp-dev1');
    var envUsersArray = [];
    readFromCpDev1.on('value', function(snapshot) {
      envUsersArray.push(snapshot.val())
      return envUsersArray;
    });
    console.log(envUsersArray, 'hey');
  },

anotherfunc: function(){
}

I have this function and I want to return envUsersArray and use it wherever. Obviously at the moment it is returning a blank array as the readData function is not in the scope of the snapshot function. How can I pass it down to the readData function and then use it inside another function such as anotherfunc

I know I probably need to call this. somewhere but the logic isn't quite coming to me at the mo

@changed I believe so. at least according to my understanding from the firebase docs — The worm
– The worm, Commented Oct 26, 2016 at 10:42

Pavel Staselun · Accepted Answer · 2016-10-26 10:45:07Z

1

I'd suggest using Promises.

  readData: function(){
    return new Promise(function(resolve) {
      var readFromCpDev1 = firebase.database().ref('environments/' + 'cp-dev1');
      var envUsersArray = [];
      readFromCpDev1.on('value', function(snapshot) {
        envUsersArray.push(snapshot.val())
        resolve(envUsersArray);
      });
    });
  },

  anotherfunc: function(){
    this.readData().then(function(arr) {
      //do stuff here
    });
  }

answered Oct 26, 2016 at 10:45

Pavel Staselun

2,0201 gold badge13 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Rytis Alekna · Accepted Answer · 2016-10-26 10:48:15Z

0

You may return a promise that will resolve with value that is retrieved asynchronously:

  readData: function() {
    var readFromCpDev1 = firebase.database().ref('environments/' + 'cp-dev1');
    var envUsersArray = [];
      return new Promise(function(success) {
      readFromCpDev1.on('value', function(snapshot) {
        envUsersArray.push(snapshot.val())
        success(envUsersArray);
      }
    });
  },

  anotherfunc: function(){
   this.readData().then(function(result) {
     console.log(result);
   });
  }

answered Oct 26, 2016 at 10:48

Rytis Alekna

1,3777 silver badges18 bronze badges

1 Comment

Rytis Alekna Over a year ago

It's actually same as what @Pavel Staselun answered.

Collectives™ on Stack Overflow

Passing an array to another function in ReactJS

2 Answers 2

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related