node.js - 获取并渲染 api 到 Dom
问题描述
我在 HTML 中呈现数据时遇到问题,我在控制台中获取对象没有任何错误,但 DOM 中没有显示任何内容。您可以在下面的代码中看到。
fetch("api/meals")
.then(res => {
return res.json();
})
.then(response => {
console.log(response);
let root = `
<h2>meals API</h2>
`;
Array.prototype.forEach.call(response, array => {
const {
id,
title,
description,
location,
when,
max_reservation,
price,
created_date
} = array;
root += `
<h5>meal ID: ${id}</h5>
<ul class="w3-ul">
<li>title : ${title}</li>
<li>description : ${description}</li>
<li>location : ${location}</li>
<li>when : ${when}</li>
<li>max_reservation : ${max_reservation}</li>
<li>price : ${price}</li>
<li>created_date : ${created_date}</li>
</ul>
</div>
`;
document.getElementById("root").innerHTML = root;
});
});
解决方案
推荐阅读
- asp.net - 如何在 javascript 中从我的网页 cshtml 中读取数组?
- python - 使用 python 和 selenium webdriver 创建自动表单填充,但我无法自动填充文本框
- dialogflow-es - 登录事件后调用的默认回退意图
- ansible - 如何从ansible中获取纯字符串中的错误
- c# - C# 内联变量声明未能在 Appveyor 上部署
- react-native - 动态更改背景图像
- android - 如何在我的 YoutubePlayerFragment 下方动态设置按钮?(设置 layoutParams 不起作用)
- amazon-web-services - 如何通过 CLI 为 Lambda 加密环境变量?
- android - setImageUri 将 ImageView 留空
- xamarin - 如何在 Xamarin.Forms 中的按钮上设置图像高度