'I am getting error while fetching data in react-native

Here is the api link:

http://api.aladhan.com/v1/timingsByCity?city=Dubai&country=United%20Arab%20Emirates&method=8

<Text>{responseMsg.code}</Text>
<Text>{responseMsg.status}</Text>

The above lines are working. I am able to fetch data from this API like, code, status but I am unable to fetch prayer times from this API. I don't know how to write that line to fetch prayer times from this API.

<Text>{(responseMsg.data || []).map(time => time.timings.Fajr)}</Text>
<Text>{(responseMsg.data || []).map(time => time.timings.Dhuhr)}</Text>

I am getting the following error TypeError: undefined is not an object (evaluating '(responseMsg.data || {}).timings.Fajr')



Solution 1:[1]

You should directly access the timings because data field is object and not an array. What you have to write is :

<Text>{(responseMsg.data || {}).timings.Fajr}</Text>

Solution 2:[2]

.Map on responseMsg.data won't work as data is an object. Map is a function on arrays not object.

Solution 3:[3]

I know that my answer is sooo late ,since i was searching for the same issue

the trick is that in the output json nested objects,ther is another child data object so to access prayers times :

fajr=response.data.data.timings.fajr

yes data.data

timezone=response.data.data.meta.timezone
hijriDay=response.data.data.date.hijri.day
hijriMonth=response.data.data.date.hijri.month.en
hijriYear=response.data.data.date.hijri.year

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Asad Marfani
Solution 2 Atin Singh
Solution 3 Ahmad Dawood