[英]De-structuring of an array object fetched from an API
我的任务是使用URL https://randomapi.com/api/d12c99b82acfefae33f7ce9239b57811从API中获取数组对象,并且我需要对数组进行解构,并将该数组中的结果值仅分配给我代码中的变量数据。 这是我尝试过的样品
const displayMenu = ({ results } = {}) => {
const [data] = results[1];
menu = Object.values(data);
};
const fetchAndDisplayMenu = () => {
const api = 'https://randomapi.com/api/d12c99b82acfefae33f7ce9239b57811';
fetch(api)
.then(response => response.json())
.then((data) => {
displayMenu();
});
};
它带来一个错误,您要解构的数组没有迭代?
从API获取的对象看起来像这样
{
results: [
{
"17651135-1987-4d14-af8e-6dd5d5356cab": {
id: "17651135-1987-4d14-af8e-6dd5d5356cab",
price: 4829,
sample: "https://lorempixel.com/640/480/food",
origin: "Tanzania"
},
"bdeb5dc0-3c6c-4b20-9e4a-7d3c9dd9e969": {
id: "bdeb5dc0-3c6c-4b20-9e4a-7d3c9dd9e969",
price: 5786,
sample: "https://lorempixel.com/640/480/food",
origin: "Congo Brazzaville"
},
"12ca14ea-f791-4390-82bf-3b2db8f20311": {
id: "12ca14ea-f791-4390-82bf-3b2db8f20311",
price: 3418,
sample: "https://lorempixel.com/640/480/food",
origin: "Seychelles"
},
"fb2c0876-03b0-4885-9d40-781393903524": {
id: "fb2c0876-03b0-4885-9d40-781393903524",
price: 5411,
sample: "https://lorempixel.com/640/480/food",
origin: "Eritrea"
}
}
],
info: {
seed: "5e5bcec11b782295",
results: "1",
page: "1",
version: "0.1",
time: {
instruct: 10,
generate: 5
}
}
};
您收到此错误的原因有两个:
results[1]
不存在 displayMenu()
,因此首先没有任何数据可使用。 您应该这样编写代码:
const displayMenu = ({ results } = {}) => { const [data] = results; const menu = Object.values(data); console.log(menu) }; const fetchAndDisplayMenu = () => { const api = 'https://randomapi.com/api/d12c99b82acfefae33f7ce9239b57811'; fetch(api) .then(response => response.json()) .then(displayMenu); }; fetchAndDisplayMenu()
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.