javascript - 从 api 列表访问每个项目
问题描述
axios.get("https://api.vschool.io/<username>/todo")
.then(response => {
for(let i = 0; i < response.data.length; i++){
const h1 = document.createElement('h1')
h1.textContent = response.data[i].title
document.body.appendChild(h1)
}
})
.catch(error => console.log(error))
我已经完成了一个 api 列表并让它出现在浏览器中。我正在尝试对其进行样式设置并稍微移动它,但对于我的生活,我不知道如何访问每个单独的项目(我的最终目标是能够在特别是项目时划线完成。谢谢
解决方案
检查状态是否是假设completed
然后为该 h1 添加一个类
axios.get("https://api.vschool.io/<username>/todo")
.then(response => {
for(let i = 0; i < response.data.length; i++){
const h1 = document.createElement('h1');
h1.textContent = response.data[i].title;
if (response.data[i].taskStatus == 'completed'){
h1.classList.add('completed')
}
document.body.appendChild(h1);
}
})
.catch(error => console.log(error))
CSS
.completed{
text-decoration-line: line-through;
}
推荐阅读
- javascript - 使用 Formik 和 material-ui stepper 上传文件
- r - 部分适用于用于检查一列中的列值是否存在于另一列中的语句
- javascript - mongoDB - 从一个集合中获取数据并保存到另一个集合
- flutter - Flutter Image Cropper 无法加载资源
- python - 如何按值对两个列表的字典进行排序
- python - LINPROG 区别 MATLAB 和 Python
- python - 如何使用具有多对多关系的复选框来保存多个用户?
- kubernetes - 使用不存在的存储类创建 PersistentVolume 成功
- java - 如何操作 Java 的 BigIntegers
- python - 使用等效变量有效地重塑 Pandas 数据框