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
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.