javascript - 如何访问'key'对象reactJS的对象属性
问题描述
想要输出这个 JSON 数据
我正在努力寻找一种方法来输出我从 Firebase 提取的这些数据,主要是因为我不知道如何选择“日期”对象中的对象。Firebase 会自动生成这些密钥:-LMgzJGM78f0BHbPf8cc
.
我无法输出上面命名的对象的属性^我尝试过使用嵌套for(in)
循环。
这是我目前使用的代码:
从数据库中提取数据
componentDidMount() {
axios.get('./tasks.json')
.then(response => {
const fetchedTasks = [];
for (let date in response.data) {
fetchedTasks.push({
...response.data[date],
date: date,
});
for (let item in response.data[date]) {
fetchedTasks.push({
...response.data[date[item]],
id: item
})
}
}
this.setState((prevState, props) => {
return {
taskList: fetchedTasks,
loading: false
}
})
})
.catch(error => console.log(error));
}
将状态映射到 JSX 元素,仅输出如下props.name
:
{this.state.taskList.map((array, index) => (
<CompleteTask
key={array.date}
taskName={array.date}
/>
) )
}
这是一个将数据作为 JSON 文件的示例,它在我的应用程序中设置为状态:
{
"tasks" : {
"09182018" : {
"-LMgzJGM78f0BHbPf8cc" : {
"hours" : 0,
"end" : "2018-09-18T14:02:25.022Z",
"minutes" : 0,
"name" : "sadflkjdsalkf",
"seconds" : 2,
"start" : "2018-09-18T14:02:22.508Z"
},
"-LMgzaEYe0tcCjpxOuPU" : {
"hours" : 0,
"end" : "2018-09-18T14:03:38.635Z",
"minutes" : 0,
"name" : "safd",
"seconds" : 2,
"start" : "2018-09-18T14:03:36.353Z"
}
},
}
}
-LMgzaEYe0tcCjpxOuPU
我不确定如何访问的关键元素的属性,这些数据是由我的应用程序中的另一部分创建的,我是否应该移动到更浅的状态以输出“小时”、“姓名”、分钟等的属性或有没有办法像现在一样访问它?
提前谢谢了。
解决方案
您是否在问如何访问具有问题名称的属性,例如-LMgzJGM78f0BHbPf8cc
?
如果是这样,object.property
您可以使用方括号语法通过属性名称访问对象属性,而不是符号:
let obj = { color: 'blue' }
let prop = 'color'
console.log(obj.color);
console.log(obj['color']);
console.log(obj[prop]);
如果没有,请尝试更清楚地说明您当前的问题是什么。
推荐阅读
- php - 使用 nginx 配置文件在 wordpress 中保护 wp-login.php
- powershell - Powershell在一个Select-Object中获取不同级别的节点值
- pine-script - TradingView v1 到 v4 iff 语句 Pine 脚本
- swift - 如何在 Swift 中获取 WebRTC iOS SDK 中的 getStats()?
- c# - c#字符串索引每2个元素
- reactjs - redux计算数据重新渲染如何修复
- reactjs - ReactJs 检查 HTTP 请求响应的有效性
- java - Spring boot 和 springfox-swagger2 - $ref 值必须是符合 RFC3986 的百分比编码 URI - 提供的解决方案
- docker - Ansible - 通过 Docker 安装 Check_MK
- null - 在 Java8 中使用流时我们是否应该始终检查 Optional?