json - Reactjs / JSON 对象,试图在嵌套的 JSON 对象中显示数据
问题描述
我被困在试图在 reactjs 的嵌套对象中显示某个值。我使用的这种方法适用于一个嵌套对象,如下所示:
代码不起作用,无法显示此数据(无法从 customfield_11400 'value' 获取数据)
{this.state.tickets && this.state.tickets.issues && this.state.tickets.issues.fields && this.state.tickets.issues.fields.customfield_11400 && Object.keys(this.state.tickets.issues.fields.customfield_11400).map((issue, i) =>
(
<tr key={i}>
<td> {this.state.tickets.issues.fields.customfield_11400[i].value} </td>
</tr>
))}
代码可以显示此数据(我能够获取“键”值)
{this.state.tickets && this.state.tickets.issues && Object.keys(this.state.tickets.issues).map((issue, i) =>
(
<tr key={i}>
<td> {this.state.tickets.issues[i].key} </td>
</tr>
))}
尝试此解决方案似乎不起作用
{ this.state.tickets && this.state.tickets.issues && Object.keys(this.state.tickets.issues).map((issue, issue_index) => (
this.state.tickets && this.state.tickets.issues && this.state.tickets.issues.fields && this.state.tickets.issues.fields.customfield_11400 && Object.keys(this.state.tickets.issues.fields.customfield_11400).map((airlineName, field_index)=>(
<li key={field_index}>
Airline Name: {this.state.tickets.issues[issue_index].fields.customfield_11400[field_index].value }
</li>
)
)))}
尝试此解决方案 2 似乎不起作用
const fields = () => this.state.tickets && this.state.tickets.issues && Object.keys(this.state.tickets.issues).map((issue, issue_i) => {
return this.state.tickets && this.state.tickets.issues && this.state.tickets.issues.fields && this.state.tickets.issues.fields.customfield_11400 && Object.keys(this.state.tickets.issues.fields.customfield_11400).map((field, field_i) => {
return (<div> {this.state.tickets.issues[issue_i].fields.customfield_11400[issue_i].value} </div>)
})
});
return
(
{fields()}
);
解决方案
根据您上面的图片,issues
并且customfield_11400
是数组,因此,您需要像这样访问它:
this.state.tickets.issues[issue_index].fields.customfield_11400[field_index].value
由于您正在遍历问题,因此i
是问题的索引。您可能需要另一个循环循环customfield_11400
,或者如果customfield_11400
只有一个元素,您可以使用如下内容:
this.state.tickets.issues[i].fields.customfield_11400[0].value
编辑:
要遍历两个数组,您可以执行以下操作,但是,您必须添加空检查:
const fields = this.state.tickets.issues.map(issue => {
return issue.fields.customfield_11400.map(field => {
return (<div> {field.value} </div>)
})
});
推荐阅读
- python - 基于另一个布尔列使用 Django-Tables2 格式化列
- javascript - 我在尝试使用道具时遇到打字错误,有没有办法解决这个问题?
- django - 我在 django 视图中的 success_url 中放了什么。现在,这不是保存编辑的表单,也不是重定向页面
- sql - 复合主键中的 NULL 值
- speech-to-text - 如何使用创建自定义类来格式化 Google Speech-to-Text api 中的电话号码?
- javascript - 选择的选项不使用 JQuery 选择
- python - 程序运行,但是当我输入我的值时它什么也没做。这是一场石头剪刀布游戏
- android - 如何在回收器视图适配器类中实例化视图模型
- r - 使用 lag() 比较同一数据框中的行
- next.js - next.js 无法获取客户端错误