How to Fetch APIs and Print first element in response Array?











up vote
0
down vote

favorite












My React Native app fetch API data and I need to print the first index of response but it's not, and gets all of the "ozone" for example in all child of the parent Array and when I print val[0] when Mapping I have nothing printed



the Result I need just one of them



My Code|



export default class App extends Component {
constructor(props) {
super(props);
this.state = { isLoading: true, dataSource: null };
}
async componentDidMount() {
let API_WEATHER =
"https://api.weatherbit.io/v2.0/forecast/daily?city=Raleigh,NC&key={API_KEY}";
fetch(API_WEATHER)
.then(response => response.json())
.then(responseJson => {
console.log(responseJson.data);
this.setState({
isLoading: false,
dataSource: responseJson.data
});
})
.catch(error => {
console.log(error);
});
}
render() {
if (this.state.isLoading) {
return (
<View style={{ flex: 1, padding: 20 }}>
<ActivityIndicator size="large" />
</View>
);
}
let weather= this.state.dataSource.map((val, key) => {
return (
<Text key={key}>
{val.ozone}
</Text>
);
});
return (
<ScrollView style={styles.container}>
<ScrollView>
<View>
<Text>{weather}</Text>
</View>
</ScrollView>
</ScrollView>
);
}


In this part of the code when i log the respone JSON obj



    .then(responseJson => {
console.log(responseJson.data);
console.log(responseJson.data[0]);
console.log(responseJson.data[0].datetime);
}


i have what i need, but when print them in View i have Erroe
look at the Images



Console










share|improve this question
























  • what is the output of ` console.log(responseJson.data);`?
    – Akrion
    Nov 10 at 19:13










  • @AkrionI have an Array of objects
    – Gh a
    Nov 10 at 19:16










  • @Akrion check the update issue
    – Gh a
    Nov 10 at 19:35















up vote
0
down vote

favorite












My React Native app fetch API data and I need to print the first index of response but it's not, and gets all of the "ozone" for example in all child of the parent Array and when I print val[0] when Mapping I have nothing printed



the Result I need just one of them



My Code|



export default class App extends Component {
constructor(props) {
super(props);
this.state = { isLoading: true, dataSource: null };
}
async componentDidMount() {
let API_WEATHER =
"https://api.weatherbit.io/v2.0/forecast/daily?city=Raleigh,NC&key={API_KEY}";
fetch(API_WEATHER)
.then(response => response.json())
.then(responseJson => {
console.log(responseJson.data);
this.setState({
isLoading: false,
dataSource: responseJson.data
});
})
.catch(error => {
console.log(error);
});
}
render() {
if (this.state.isLoading) {
return (
<View style={{ flex: 1, padding: 20 }}>
<ActivityIndicator size="large" />
</View>
);
}
let weather= this.state.dataSource.map((val, key) => {
return (
<Text key={key}>
{val.ozone}
</Text>
);
});
return (
<ScrollView style={styles.container}>
<ScrollView>
<View>
<Text>{weather}</Text>
</View>
</ScrollView>
</ScrollView>
);
}


In this part of the code when i log the respone JSON obj



    .then(responseJson => {
console.log(responseJson.data);
console.log(responseJson.data[0]);
console.log(responseJson.data[0].datetime);
}


i have what i need, but when print them in View i have Erroe
look at the Images



Console










share|improve this question
























  • what is the output of ` console.log(responseJson.data);`?
    – Akrion
    Nov 10 at 19:13










  • @AkrionI have an Array of objects
    – Gh a
    Nov 10 at 19:16










  • @Akrion check the update issue
    – Gh a
    Nov 10 at 19:35













up vote
0
down vote

favorite









up vote
0
down vote

favorite











My React Native app fetch API data and I need to print the first index of response but it's not, and gets all of the "ozone" for example in all child of the parent Array and when I print val[0] when Mapping I have nothing printed



the Result I need just one of them



My Code|



export default class App extends Component {
constructor(props) {
super(props);
this.state = { isLoading: true, dataSource: null };
}
async componentDidMount() {
let API_WEATHER =
"https://api.weatherbit.io/v2.0/forecast/daily?city=Raleigh,NC&key={API_KEY}";
fetch(API_WEATHER)
.then(response => response.json())
.then(responseJson => {
console.log(responseJson.data);
this.setState({
isLoading: false,
dataSource: responseJson.data
});
})
.catch(error => {
console.log(error);
});
}
render() {
if (this.state.isLoading) {
return (
<View style={{ flex: 1, padding: 20 }}>
<ActivityIndicator size="large" />
</View>
);
}
let weather= this.state.dataSource.map((val, key) => {
return (
<Text key={key}>
{val.ozone}
</Text>
);
});
return (
<ScrollView style={styles.container}>
<ScrollView>
<View>
<Text>{weather}</Text>
</View>
</ScrollView>
</ScrollView>
);
}


In this part of the code when i log the respone JSON obj



    .then(responseJson => {
console.log(responseJson.data);
console.log(responseJson.data[0]);
console.log(responseJson.data[0].datetime);
}


i have what i need, but when print them in View i have Erroe
look at the Images



Console










share|improve this question















My React Native app fetch API data and I need to print the first index of response but it's not, and gets all of the "ozone" for example in all child of the parent Array and when I print val[0] when Mapping I have nothing printed



the Result I need just one of them



My Code|



export default class App extends Component {
constructor(props) {
super(props);
this.state = { isLoading: true, dataSource: null };
}
async componentDidMount() {
let API_WEATHER =
"https://api.weatherbit.io/v2.0/forecast/daily?city=Raleigh,NC&key={API_KEY}";
fetch(API_WEATHER)
.then(response => response.json())
.then(responseJson => {
console.log(responseJson.data);
this.setState({
isLoading: false,
dataSource: responseJson.data
});
})
.catch(error => {
console.log(error);
});
}
render() {
if (this.state.isLoading) {
return (
<View style={{ flex: 1, padding: 20 }}>
<ActivityIndicator size="large" />
</View>
);
}
let weather= this.state.dataSource.map((val, key) => {
return (
<Text key={key}>
{val.ozone}
</Text>
);
});
return (
<ScrollView style={styles.container}>
<ScrollView>
<View>
<Text>{weather}</Text>
</View>
</ScrollView>
</ScrollView>
);
}


In this part of the code when i log the respone JSON obj



    .then(responseJson => {
console.log(responseJson.data);
console.log(responseJson.data[0]);
console.log(responseJson.data[0].datetime);
}


i have what i need, but when print them in View i have Erroe
look at the Images



Console







javascript reactjs api react-native fetch






share|improve this question















share|improve this question













share|improve this question




share|improve this question








edited Nov 10 at 19:30

























asked Nov 10 at 19:04









Gh a

707




707












  • what is the output of ` console.log(responseJson.data);`?
    – Akrion
    Nov 10 at 19:13










  • @AkrionI have an Array of objects
    – Gh a
    Nov 10 at 19:16










  • @Akrion check the update issue
    – Gh a
    Nov 10 at 19:35


















  • what is the output of ` console.log(responseJson.data);`?
    – Akrion
    Nov 10 at 19:13










  • @AkrionI have an Array of objects
    – Gh a
    Nov 10 at 19:16










  • @Akrion check the update issue
    – Gh a
    Nov 10 at 19:35
















what is the output of ` console.log(responseJson.data);`?
– Akrion
Nov 10 at 19:13




what is the output of ` console.log(responseJson.data);`?
– Akrion
Nov 10 at 19:13












@AkrionI have an Array of objects
– Gh a
Nov 10 at 19:16




@AkrionI have an Array of objects
– Gh a
Nov 10 at 19:16












@Akrion check the update issue
– Gh a
Nov 10 at 19:35




@Akrion check the update issue
– Gh a
Nov 10 at 19:35












1 Answer
1






active

oldest

votes

















up vote
0
down vote



accepted










You're probably the first key of the object.



obj[Object.keys(obj)[0]];


Also, you can use



Try the for … in loop and break after the first iteration



for (var prop in object) {
// object[prop]
break;
}





share|improve this answer























  • Nope, I need to print object number One in the Hole Response Array which contains 16 objects then print the elements of this object num 1 look at last screenShots in Q
    – Gh a
    Nov 10 at 19:52










  • so you need an array of the obj keys and only after that it's possible to get the first by index
    – victor zadorozhnyy
    Nov 10 at 19:57










  • hmm,can you manipulate your code "obj[Object.keys(obj)[0]];" and put in my our Code ?
    – Gh a
    Nov 10 at 20:02










  • Oh, I do it :D, Thank you, bro !
    – Gh a
    Nov 10 at 20:05










  • @Gha Can you accept this answer?
    – victor zadorozhnyy
    Nov 10 at 20:08











Your Answer






StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});


}
});














 

draft saved


draft discarded


















StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53242432%2fhow-to-fetch-apis-and-print-first-element-in-response-array%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown

























1 Answer
1






active

oldest

votes








1 Answer
1






active

oldest

votes









active

oldest

votes






active

oldest

votes








up vote
0
down vote



accepted










You're probably the first key of the object.



obj[Object.keys(obj)[0]];


Also, you can use



Try the for … in loop and break after the first iteration



for (var prop in object) {
// object[prop]
break;
}





share|improve this answer























  • Nope, I need to print object number One in the Hole Response Array which contains 16 objects then print the elements of this object num 1 look at last screenShots in Q
    – Gh a
    Nov 10 at 19:52










  • so you need an array of the obj keys and only after that it's possible to get the first by index
    – victor zadorozhnyy
    Nov 10 at 19:57










  • hmm,can you manipulate your code "obj[Object.keys(obj)[0]];" and put in my our Code ?
    – Gh a
    Nov 10 at 20:02










  • Oh, I do it :D, Thank you, bro !
    – Gh a
    Nov 10 at 20:05










  • @Gha Can you accept this answer?
    – victor zadorozhnyy
    Nov 10 at 20:08















up vote
0
down vote



accepted










You're probably the first key of the object.



obj[Object.keys(obj)[0]];


Also, you can use



Try the for … in loop and break after the first iteration



for (var prop in object) {
// object[prop]
break;
}





share|improve this answer























  • Nope, I need to print object number One in the Hole Response Array which contains 16 objects then print the elements of this object num 1 look at last screenShots in Q
    – Gh a
    Nov 10 at 19:52










  • so you need an array of the obj keys and only after that it's possible to get the first by index
    – victor zadorozhnyy
    Nov 10 at 19:57










  • hmm,can you manipulate your code "obj[Object.keys(obj)[0]];" and put in my our Code ?
    – Gh a
    Nov 10 at 20:02










  • Oh, I do it :D, Thank you, bro !
    – Gh a
    Nov 10 at 20:05










  • @Gha Can you accept this answer?
    – victor zadorozhnyy
    Nov 10 at 20:08













up vote
0
down vote



accepted







up vote
0
down vote



accepted






You're probably the first key of the object.



obj[Object.keys(obj)[0]];


Also, you can use



Try the for … in loop and break after the first iteration



for (var prop in object) {
// object[prop]
break;
}





share|improve this answer














You're probably the first key of the object.



obj[Object.keys(obj)[0]];


Also, you can use



Try the for … in loop and break after the first iteration



for (var prop in object) {
// object[prop]
break;
}






share|improve this answer














share|improve this answer



share|improve this answer








edited Nov 10 at 20:07

























answered Nov 10 at 19:39









victor zadorozhnyy

251412




251412












  • Nope, I need to print object number One in the Hole Response Array which contains 16 objects then print the elements of this object num 1 look at last screenShots in Q
    – Gh a
    Nov 10 at 19:52










  • so you need an array of the obj keys and only after that it's possible to get the first by index
    – victor zadorozhnyy
    Nov 10 at 19:57










  • hmm,can you manipulate your code "obj[Object.keys(obj)[0]];" and put in my our Code ?
    – Gh a
    Nov 10 at 20:02










  • Oh, I do it :D, Thank you, bro !
    – Gh a
    Nov 10 at 20:05










  • @Gha Can you accept this answer?
    – victor zadorozhnyy
    Nov 10 at 20:08


















  • Nope, I need to print object number One in the Hole Response Array which contains 16 objects then print the elements of this object num 1 look at last screenShots in Q
    – Gh a
    Nov 10 at 19:52










  • so you need an array of the obj keys and only after that it's possible to get the first by index
    – victor zadorozhnyy
    Nov 10 at 19:57










  • hmm,can you manipulate your code "obj[Object.keys(obj)[0]];" and put in my our Code ?
    – Gh a
    Nov 10 at 20:02










  • Oh, I do it :D, Thank you, bro !
    – Gh a
    Nov 10 at 20:05










  • @Gha Can you accept this answer?
    – victor zadorozhnyy
    Nov 10 at 20:08
















Nope, I need to print object number One in the Hole Response Array which contains 16 objects then print the elements of this object num 1 look at last screenShots in Q
– Gh a
Nov 10 at 19:52




Nope, I need to print object number One in the Hole Response Array which contains 16 objects then print the elements of this object num 1 look at last screenShots in Q
– Gh a
Nov 10 at 19:52












so you need an array of the obj keys and only after that it's possible to get the first by index
– victor zadorozhnyy
Nov 10 at 19:57




so you need an array of the obj keys and only after that it's possible to get the first by index
– victor zadorozhnyy
Nov 10 at 19:57












hmm,can you manipulate your code "obj[Object.keys(obj)[0]];" and put in my our Code ?
– Gh a
Nov 10 at 20:02




hmm,can you manipulate your code "obj[Object.keys(obj)[0]];" and put in my our Code ?
– Gh a
Nov 10 at 20:02












Oh, I do it :D, Thank you, bro !
– Gh a
Nov 10 at 20:05




Oh, I do it :D, Thank you, bro !
– Gh a
Nov 10 at 20:05












@Gha Can you accept this answer?
– victor zadorozhnyy
Nov 10 at 20:08




@Gha Can you accept this answer?
– victor zadorozhnyy
Nov 10 at 20:08


















 

draft saved


draft discarded



















































 


draft saved


draft discarded














StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53242432%2fhow-to-fetch-apis-and-print-first-element-in-response-array%23new-answer', 'question_page');
}
);

Post as a guest















Required, but never shown





















































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown

































Required, but never shown














Required, but never shown












Required, but never shown







Required, but never shown







Popular posts from this blog

Bressuire

Vorschmack

Quarantine