Question

我正在尝试从API获取并显示数据。下面的响应，我从API。我想从详细信息数组中显示“名称”的值。请帮助我解决这个问题。我已经尝试过以下代码

{ 
   "Success":1,
   "data":[ 
      { 
         "Date":"2019-11-08",
         "Details":[ 
            { 
               "Name":"Name 1",
               "Id":72
            },
            { 
               "Name":"Name 2",
               "Id":73
            }
         ]
      },
       { 
         "Date":"2019-11-09",
         "Details":[ 
            { 
               "Name":"Name 3",
               "Id":72
            },
            { 
               "Name":"Name 4",
               "Id":73
            }
         ]
      }
      ]
}

Answer 1

JavaScript映射函数可用于嵌套迭代。

考虑您的数据以 data 状态存储。如果在名为response的变量中收到响应，则可以将状态设置为

this.setState({ data : response.data })

然后，您可以使用以下代码片段迭代嵌套对象的值

{

  this.state.data.map((dat, index) => { //Iterate through your data 

    return (
      <View style={styles.selectedCh} key={"outer-" + index}>
        <Text>{dat.Date}</Text>

        {
          dat.Details.map((inner, indexInner) => {  //Iterate through inner Details
            return (
              <View style={{ flex: 1 }} key={"inner-" + indexInner} >
                <Text>{inner.Id}</Text>
                <Text>{inner.Name}</Text>
              </View>
            )
          })

        }

      </View>
    )
  })
}

如何显示来自API的react native中的嵌套数组数据？

1 个答案: