当道具通过Array时，我的组件没有呈现

Question

我有一个数组的对象和对象包含不同的东西，如id，标题，价格。我正在使用最新的遍历数组的方法，每次我都呈现我的组件，但是组件没有呈现。

​

{
  basket.map(item => {
    <CheckoutProduct
      id={item.id}
      title={item.title}
      image={item.title}
      price={item.price}
      rating={item.rating}
    />
  })
}

​

在这里，购物篮是一个数组，我使用了map函数来迭代购物篮，而CheckoutProduct是我的组件。

如果不调用数组中的组件，则它正在呈现，而在数组中则不呈现。

当我在控制台上记录篮子的标题、id、价格时，它们会打印在控制台上，比如{console.log(项目)}和这个{ console.log(items?.title) }

唯一的问题是在我使用数组渲染它的时候。该怎么办呢？

Answer 1

跳过花括号，使代码看起来如下所示：

{
  basket.map(item => 
    <CheckoutProduct
      id={item.id}
      title={item.title}
      image={item.title}
      price={item.price}
      rating={item.rating}
    />
  )
}

从而使map函数返回为<CheckoutProduct>元素。否则，map只运行而不返回任何内容，因此不会呈现任何内容。