1

所以,我在 api 中迭代我想要的数据时遇到了一些麻烦。我有一个这样的api:

{
  "datatype": "text",
  "data": [
    {
      "date": "09/08/09",
      "events": [
        {
          "eventDate": "2017-08-05T00:00:00.000",
          "dataValues": [
            {
              "displayName": "Name",
              "value": "Josh"
            },
            {
              "displayName": "Surname",
              "value": "Rashford"
            },
            {
              "dataElement": "Birth date",
              "value": "09/11/1999"
            }
          ]
        },
        {
          "eventDate": "2017-08-05T00:00:00.000",
          "dataValues": [
            {
              "displayName": "Name",
              "value": "Josh"
            },
            {
              "displayName": "Surname",
              "value": "Rashford"
            },
            {
              "dataElement": "Birth date",
              "value": "09/11/1999"
            }
          ]
        }
      ]
    }
  ]
}

我的代码

 < table className = "table table-bordered" > < thead > < tr > < th scope = "col" > Date < /th> < th scope = "col" > Name < /th> < th scope = "col" > Surname < /th> < /tr> < /thead> < tbody > {
    (state.data || []).map((data) => (
        (data.events || []).map((details) => (
            (details.dataValues || []).map((value) => (
                ((details.eventDate === '2017-08-05T00:00:00.000')) ? ( < tr > > < td > {
                    details.eventDate
                } < /td> < td > {
                    details.dataValues.filter(x => x.displayName === 'Name')[0].value
                } < /td>   < td > {
                    details.dataValues.filter(x => x.displayName === 'Surname')[0].value
                } < /td>   < /tr>) : (null)))))))
} < /tbody> < /table>

我从表中的 api 获取数据,但迭代可能是错误的,每行重复 4 次。我认为有一种更好的方法可以遍历 api,但我没有成功找到它,只有在减少映射时才会出错。如何在不重复的情况下获取表中的数据?

4

1 回答 1

0

您需要替换[0].valuemap(e => e.value). 这将转换数组中的每个值,而不是使用索引处的第一个值0

这是您需要的:

<td>
    {
        details.dataValues.filter(x=>x.displayName==='Name').map(e => e.value)
    }
</td>  
<td>
    {
        details.dataValues.filter(x=>x.displayName==='Surname').map(e => e.value)
    }
</td>  
于 2020-08-26T07:51:33.103 回答