Question

无法从 API 请求数据控制台日志中出现“未定义”

2020-03-13

1027

javascript asynchronous get fetch-api

我尝试从公共 API 获取一些数据，但控制台日志中始终返回“未定义”信息。

这是我目前尝试过的方法：

const api_url = 'https://wger.de/api/v2/exercise/?format=json&page=29';

async function getExercises() {
    const response = await fetch(api_url);
    const data = await response.json();
    console.log(data.name);

}
getExercises();

您知道我做错了什么吗？

Answer 1

您正在尝试访问不存在的属性。如果将代码更改为

const api_url = 'https://wger.de/api/v2/exercise/?format=json&page=29';

async function getExercises() {
    const response = await fetch(api_url);
    const data = await response.json();
    console.log(data);

}
getExercises();

您会发现返回的响应中不包含 name 属性。

您要做什么才能获取该对象数组的名字。

const api_url= 'https://wger.de/api/v2/exercise/?format=json&page=29';

            async function getExercises(){
                const response = await fetch(api_url);
                const data = await response.json();
                console.log(data.results[0].name); // <- results is an array and each item in that array has a name property inside it.

            }
            getExercises();

要获取所有名称，您可以执行

const api_url= 'https://wger.de/api/v2/exercise/?format=json&page=29';

            async function getExercises(){
                const response = await fetch(api_url);
                const data = await response.json();
                data.results.forEach( item => console.log(item.name))

            }
            getExercises();

Answer 2

您可以调试并查看数据句柄：

然后您可以获取数据的名称，如 JS Lover anwser

console.log(data.results[0].name);