使用 javascript async/await 语法时出现奇怪的错误
2021-04-28
93
我尝试从 randomuser api 获取随机用户。代码来自我的 vue 前端。
// api response
{ info: { // ommited }, results: [ {//random user data} ] }
// this works
async get_random_user() {
const url = "https://randomuser.me/api/";
const res = await fetch(url);
const json_data = await res.json();
const result = json_data.results[0];
return result;
}
// this throws Uncaught (in promise) TypeError: Cannot read property '0' of undefined
async get_random_user() {
const url = "https://randomuser.me/api/";
const res = await fetch(url);
const result = await res.json().results[0];
return result;
}
为什么第二个函数不起作用? 谢谢。
3个回答
const result = await res.json().results[0];
您正在直接访问 results 数据(可能尚未得到保证/产生),而不是等待 res.json() 完成处理
编辑
不能保证 res.json() 会产生任何数据,或者根本不会有任何正确的响应。因此,访问数据还不合理
await 在 results[0] 上被调用 它没有在 res.json() 上被调用;
为了简化,您实际上正在做的是
results = res.json();
const result = await results[0];
因此,这其中有两个逻辑错误
Manish Dhruw
2021-04-28
await
期望返回一个
promise
。
json()
返回这样的承诺,但
json().results
只是一个
object
(在开始时甚至未定义)。这就是为什么
await
在该结构上不起作用的原因。
Flash Thunder
2021-04-28
检查 res.json().results 是否不是空数组;
const result = (await res.json()).results.[0];
Ryan Garde
2021-04-28