React Native: Accessing values in returned object: undefined

Question

I am having a problem that I am apparently to stupid to solve.. I've been trying to solve this problem for to long, and it doesn't seem to crack.

I am fetching data from firebase using the following function:

export function fetchUserData(userID) {
   database.ref('users/' + userID).once('value').then(function(snapshot) {
      if (!snapshot) {
         console.log('An error occured');
      } else {
         let user = {
            first_name: snapshot.val().first_name,
            last_name: snapshot.val().last_name,
         }
         console.log(user);
         return user
      }
   })
}

That function is returning an object, which I am trying to set in state when the component is mounting:

componentWillMount() {
   this.setState({
      userData: fetchUserData('10212667682706511')
   })
}

If I then try to log the userData to the console when the component is mounted, I get undefined, although logging the user from the fetchUserData function, I get the object:

I am assuming something is getting lost when I call fetchUserData and try to store it in state, but I simply don't know how to fix it, so any help would be appreciated.

Rax Weber · Accepted Answer · 2017-03-06 04:41:26Z

1

The problem here is that your function fetchUserData returns nothing.

Your code return user returns user from the callback function (the parameter of then()).

One solution for this is to handle data within the callback function:

export function fetchUserData(userID) {
   database.ref('users/' + userID).once('value').then(function(snapshot) {
      if (!snapshot) {
         console.log('An error occured');
      } else {
         // Handle snapshot data here
      }
   })
}

edited Mar 6, 2017 at 4:41

answered Mar 5, 2017 at 16:23

Rax Weber

3,78121 silver badges30 bronze badges

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

3 Comments

Michael Nissen Over a year ago

Ohh, I totally didn't realise that ! Thank you so, so much! .. I am however wondering if there are other ways of doing this, as I would really like the function: fetchUserData to return an object with the data from the snapshot?

Rax Weber Over a year ago

@MichaelNissen You may find the answer here: stackoverflow.com/questions/6847697/…

fubar Over a year ago

Alternatively, if you return the promise from your function, you can chain additional then calls on the result to access the user value.

Collectives™ on Stack Overflow

React Native: Accessing values in returned object: undefined

1 Answer 1

3 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related