After attempting to retrieve all items stored in my AsyncStorage, I encountered an issue where the response was not in JSON format. Instead, it was returned in a different format:
[["engineyard", "{\"login\":\"engineyard\",\"id\":81,\"node_id\":\"MDEyOk9yZ2FuaXphdGlvbjgx\",\"url\":\"https://api.github.com/orgs/engineyard\",\"repos_url\":\"https://api.github.com/orgs/engineyard/repos\",\"events_url\":\"https://api.github.com/orgs/engineyard/events\",\"hooks_url\":\"https://api.github.com/orgs/engineyard/hooks\",\"issues_url\":\"https://api.github.com/orgs/engineyard/issues\",\"members_url\":\"https://api.github.com/orgs/engineyard/members{/member}\",\"public_members_url\":\"https://api.github.com/orgs/engineyard/public_members{/member}\",\"avatar_url\":\"https://avatars.githubusercontent.com/u/81?v=4\",\"description\&\quot;:\"\"}"], ["errfree", "{\"login\":\"errfree\",\"id\":44,\"node_id\&\quot;MDEyOk9yZ2FuaXphdGlvbjQ0\",\"url\":\"https://api.github.com/orgs/errfree\",\"repos_url\":\"https://api.github.com/orgs/errfree/repos\",\"events_url\":\"https://api.github.com/orgs/errfree/events\",\"hooks_url\":\"https://api.github.com/orgs/errfree/hooks\",\"issues_url\":\"https://api.github.com/orgs/errfree/issues\",\"members_url\":\"https://api.github.com/orgs/errfree/members{/member}\",\"public_members_url\":\"https://api.github.com/orgs/errfree/public_members{/member}\",\"avatar_url\":\"https://avatars.githubusercontent.com/u/44?v=4\",\"description\&\quot;:null}"]]
When attempting to retrieve a single item, it returned in JSON format. However, the current format makes it challenging to save in an array for mapping purposes.
Here is the relevant portion of my code:
const getOrgsSaved = async () => {
let value = []
try {
const keys = await AsyncStorage.getAllKeys();
const Orgs = await AsyncStorage.multiGet(keys)
return Orgs
} catch (e) {
console.log(e)
return e;
}
}
// Function to get the items
const Main: React.FC = () => {
const [orgsSave, setOrgsSaved] = useState<Array<Orgs>>([])
const [orgsData, setOrgsData] = useState<Array<Orgs>>([])
useEffect(() => {
loadOrgs()
getOrgsSaved()
},[])
const loadOrgs = () =>{
Services.getOrgs()
.then(response =>{
setOrgsData(response.data)
})
.catch(e =>{
console.log(e)
})
}
function getOrgsSaved() {
Services.getOrgsSaved() // receiving the response here
.then(response => {
console.log('get',response)
setOrgsSaved(response)
})
}
return (
<Box flex = {1} >
<Navbar/>
<SubHeader/>
<OrgsList data = {orgsData}/>
<Footer/>
</Box>
);
}
export default Main;
I attempted to use JSON.parse, but encountered this error:
[SyntaxError: JSON Parse error: Unexpected identifier "engineyard"]