我试图通过将它存储在名为“supperArray”的数组中来使用Politifact API中的信息。我这样做是通过调用API三次,并将每个响应中的10个值推送到superArray,如下所示:
const URL1 = "https://www.politifact.com/api/statements/truth-o-meter/people/barack-obama/json/?n=50";
const URL2 = "https://www.politifact.com/api/statements/truth-o-meter/people/hillary-clinton/json/?n=210";
const URL3 = "https://www.politifact.com/api/statements/truth-o-meter/people/bernie-s/json/?n=70";
var superArray = [];
fetch("https://cors-anywhere.herokuapp.com/"+URL1)
.then(results => {
return results.json();
})
.then(data => {
data=data.filter(function(item){return item.speaker.name_slug=="barack-obama" && item.statement_type.statement_type !== "Flip";});
for(var i=0; i<10; i++){
superArray.push(data.splice(Math.random()*data.length, 1)[0]);
}
})
fetch("https://cors-anywhere.herokuapp.com/"+URL2)
.then(results => {
return results.json();
})
.then(data => {
data=data.filter(function(item){return item.speaker.name_slug=="hillary-clinton" && item.statement_type.statement_type !== "Flip";});
for(var i=0; i<10; i++){
superArray.push(data.splice(Math.random()*data.length, 1)[0]);
}
})
fetch("https://cors-anywhere.herokuapp.com/"+URL3)
.then(results => {
return results.json();
})
.then(data => {
data=data.filter(function(item){return item.speaker.name_slug=="bernie-s" && item.statement_type.statement_type !== "Flip";});
for(var i=0; i<10; i++){
superArray.push(data.splice(Math.random()*data.length, 1)[0]);
}
})
当我要求React完整地记录supperArray时,如下所示:
console.log(superArray);
它记录了这个:这是我的预期。但当我要求它记录一个特定的值时,如下所示:
console.log(superArray[0]);
它的日志是undefined
为什么会这样?
原因是你没有在你的superArray
承诺中记录fetch
。如果你在上一次then()
调用中添加对console.log()的调用,它会起作用。这样做的原因是fetch是异步执行的,这意味着在fetch返回任何内容之前很久就会执行fetch调用之后的任何其他代码。
你可以看到superArray
的完整日志的原因,即使在fetch之外进行它也是一种特殊的控制台行为。
const URL1 = "https://www.politifact.com/api/statements/truth-o-meter/people/barack-obama/json/?n=50";
const URL2 = "https://www.politifact.com/api/statements/truth-o-meter/people/hillary-clinton/json/?n=210";
const URL3 = "https://www.politifact.com/api/statements/truth-o-meter/people/bernie-s/json/?n=70";
var superArray = [];
fetch("https://cors-anywhere.herokuapp.com/" + URL1)
.then(results => {
return results.json();
})
.then(data => {
data = data.filter(function(item) {
return item.speaker.name_slug == "barack-obama" && item.statement_type.statement_type !== "Flip";
});
for (var i = 0; i < 10; i++) {
superArray.push(data.splice(Math.random() * data.length, 1)[0]);
}
})
fetch("https://cors-anywhere.herokuapp.com/" + URL2)
.then(results => {
return results.json();
})
.then(data => {
data = data.filter(function(item) {
return item.speaker.name_slug == "hillary-clinton" && item.statement_type.statement_type !== "Flip";
});
for (var i = 0; i < 10; i++) {
superArray.push(data.splice(Math.random() * data.length, 1)[0]);
}
})
fetch("https://cors-anywhere.herokuapp.com/" + URL3)
.then(results => {
return results.json();
})
.then(data => {
data = data.filter(function(item) {
return item.speaker.name_slug == "bernie-s" && item.statement_type.statement_type !== "Flip";
});
for (var i = 0; i < 10; i++) {
superArray.push(data.splice(Math.random() * data.length, 1)[0]);
}
console.log(superArray[0]);
})
在获取数据之前,可以登录到您的控制台。为了确保,在完成数据之后记录,即。在.then()
内。
fetch(...)
.then(results => {...})
.then(data => {...})
.then(()=> console.log(superArr[0]))
或者,您可以使用:
superArray.length && console.log(superArray[0]);
我认为在您的console.log之前尚未执行您的URL提取。
确保在输出到控制台之前执行所有承诺。