我想获取https://swapi.co/api/people/所有名称和其他详细信息,但是当我使用axios调用来获取数据时,我得到undefined
所有数据但是如果想要一个名字我会得到控制台中出现CORS错误。
let button = document.querySelector("#button");
let name = document.querySelector("#displayDetail");
function getDetail(){
var apiURL="https://swapi.co/api/people";
axios.get(apiURL).then(function(response){
showDetail(response.data);
});
}
function showDetail(data){
name.innerText=data.name;
}
button.addEventListener('click',getDetail);
答案 0 :(得分:1)
尝试一下 swapi.co/api/people/ 为。。改变 swapi.dev/api/people /
答案 1 :(得分:0)
来自https://swapi.co/api/people的JSON数据没有name
成员。相反,它有一个results
成员,它是一个对象数组,每个成员都有一个name
成员。
因此,您需要遍历data.results
数组以获取每个name
:
function getDetail() {
var apiURL = "https://swapi.co/api/people";
axios.get(apiURL).then(function(response) {
showDetail(response.data);
});
}
function showDetail(data) {
for (i = 0; i < data.results.length; i++) {
console.log(data.results[i].name);
}
}
getDetail();
&#13;
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
&#13;
但请注意:该API端点对结果进行分页;为了获取所有名称,请检查data.next
以获取下一页的URL,然后使用该URL发出新请求以获取下一组结果:
function getDetail(apiURL) {
axios.get(apiURL).then(function(response) {
showDetail(response.data);
});
}
function showDetail(data) {
for (i = 0; i < data.results.length; i++) {
names = names + data.results[i].name + "\n";
// name1.innerText = name1.innerText + "\n" + data.results[i].name;
}
if (data.next) {
getDetail(data.next);
} else {
console.log(names); // name1.innerText = names;
}
}
var names = "";
getDetail("https://swapi.co/api/people");
&#13;
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
&#13;
答案 2 :(得分:0)
所有资源都支持搜索参数,该参数可过滤返回的资源集。这使您可以进行以下查询:
https://swapi.co/api/people/?search=r2d2
要查看每种资源的搜索字段集,请查看各个资源文档。