Arrays API中的产品列表

对于我的应用程序，我使用的API包含销售订单历史记录。 返回的数组如下所示，我以一个订单为例，该订单包含两种产品：

Object {
    "amount": 2671.25,
    "balance": 0,
    "client_id": 1,
    "created_at": "2020-05-06T17:42:26Z",
    "discount": 0,
    "discount_type": 0,
    "id": 19,
    "items": Array [
      Object {
        "cost": 2400,
        "currency": "EUR",
        "description": "blablabla",
        "name": "Apple MacBook Air 15'' LED 500 Go SSD 32 Go",
        "product_id": 5,
        "quantity": 1,
        "tax_rate_id": 1,
      },
      Object {
        "cost": 54.25,
        "currency": "EUR",
        "description": "Blablabla",
        "product_id": 2,
        "quantity": 5,
        "tax_rate_id": 4,
      },
    ],
    "po_number": "",
    "public_notes": "TEST 6 : Acomptes",
    "quote_date": "2020-05-06",
    "quote_number": "D1460019",
    "quote_status": 40,
    "terms": "",
    "updated_at": "2020-05-06T18:08:06Z",
  },

目前在我的屏幕上，我在“标题”中返回订单日期，并在下拉菜单中显示订单的总价。它可以工作，我使用以下代码：

<ScrollView>
      {
        this.state.displayArray.map((item, i) => (
        <List.Section title={item.created_at} key={i.toString()}>
          <List.Accordion
            title={item.id}
            left={props => <List.Icon {...props} icon="cart" />}>
            <List.Item title={`${item.amount} €`}/>
          </List.Accordion>     
        </List.Section>
        ))
      }
      </ScrollView>

{
this.state.displayArray.map（（项，i）=>(
}>
))
}

但是现在，我想让这个屏幕更复杂一点。我想在下拉菜单中添加商品数量和商品名称+价格（批发，了解订单详情）

我的问题是，我不知道如何从阵列中提取产品。如果我这样做

因为数组中有两个具有两个不同名称的对象，所以它不起作用。。。（我尝试过，但它返回“未定义”）

我不知道怎么做。 我知道我的英语并不完美，我不知道我的解释是否清楚。基本上在那里，我只有低于我的订单价格，我想与他们各自的价格与产品的细节

----------------------------编辑以添加解决方案-------------------------------

谢谢你@HichamELBSI

<ScrollView>
      {
        this.state.displayArray.map((item, i) => (
        <List.Section title={item.created_at} key={i.toString()}>
          <List.Accordion
            title={item.id}
            left={props => <List.Icon {...props} icon="cart" />}>
            <List.Item title={`${item.amount} €`}/>
            {
              item.items.map((product, i) => (
              <List.Item title={product.name} key={i.toString()}/>
              ))
            }
          </List.Accordion>            
        </List.Section>
        ))
      }
</ScrollView>

{
this.state.displayArray.map（（项，i）=>(
}>
{
item.items.map（（产品，i）=>(
))
}
))
}

我认为您可以像为显示器所做的那样映射产品

{
this.state.displayArray.map（（项，i）=>(
}>
{item.items.map（产品=>(
)}} 
))
}

---

让我知道这是否是您所需要的

我使用了您的代码，并对其进行了轻微的调整，效果良好！！！谢谢！！！非常真诚地感谢！我允许自己编辑我的帖子以添加确切的解决方案。