Im getting this error while developing react native mobile application.

fetchDB function will return a promise

 fetchDB(key) {
    try {
      AsyncStorage.getItem(key, result => {
        return result;
      });
    } catch (error) {
      console.log(error);
    }
  }
}

fetching value from returned promise by using .then()

  getUserName = () => {
    var user = Storage.fetchDB("username");
    user.then(res => {
      alert(res);
    });
  };

its rendering the red screen with error

undefined is not an object

Im getting this error while developing react native mobile application.

fetchDB function will return a promise

 fetchDB(key) {
    try {
      AsyncStorage.getItem(key, result => {
        return result;
      });
    } catch (error) {
      console.log(error);
    }
  }
}

fetching value from returned promise by using .then()

  getUserName = () => {
    var user = Storage.fetchDB("username");
    user.then(res => {
      alert(res);
    });
  };

its rendering the red screen with error

undefined is not an object

• javascript
• react-native
• ecmascript-6
• promise
• es6-promise

Share Improve this question Follow edited Oct 5, 2017 at 11:54 dhilt 20.9k88 gold badges7979 silver badges9393 bronze badges asked Oct 5, 2017 at 9:57 KartiikeyaKartiikeya 2,52699 gold badges3939 silver badges7070 bronze badges 1

• AsyncStorage.getItem is asynchronous? anyway, a return value inside a callback function doesn't mean you're returning something from fetchDB function ... so you have two issues ... understanding asynchronous code, and understanding that your function doesn't actually return anything anyway ... try simply return AsyncStorage.getItem(key); – Jaromanda X Commented Oct 5, 2017 at 10:04

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 4

1) You need to return the promise function explicitly. Fail situation could be handled within catch callback:

fetchDB(key) {
 return AsyncStorage.getItem(key).catch(error => console.log(error));
}

fetchDB("username").then(res => alert(res));

2) Point (1) works only if AsyncStorage.getItem really returns promise. If it's not true, then you need to update AsyncStorage.getItem method to be promise-based. If you have not access to that method or don't want to touch it, the issue could be done also via updating fetchDB function in a way like:

fetchDB(key) {
  return new Promise((resolve, reject) => {
    try {
      AsyncStorage.getItem(key, resolve);
    } 
    catch (error) {
      reject(error);
    }
  })
}

fetchDB("username")
  .then(res => alert(res))
  .catch(error => console.log(error));

3) I would even say that you don't need try-catch due to es6 Promises nature:

fetchDB(key) {
  return new Promise((resolve, reject) =>
    AsyncStorage.getItem(key, resolve)
  )
}

fetchDB("username")
  .then(res => alert(res))
  .catch(error => console.log(error));

That last .catch handles any errors thrown from fetchDB Promise.