将数据从对象发送到React组件

Question

访问对象内部的数据以将其发送到React组件

我正在尝试恢复看起来像这样的对象内的数据：

{89: {…}, 91: {…}, 92: {…}}

89: {name: "Confiture de Myrtilles", product_id: "737", _wc_review_count: "0", _wc_rating_count: "a:0:{}", _wc_average_rating: "0", …}

91: {name: "Poires Guyot (bio)", product_id: "690", _wc_review_count: "0", _wc_rating_count: "a:0:{}", _wc_average_rating: "0", …}

92: {name: "Pommes Pinova (bio)", product_id: "700", _wc_review_count: "0", _wc_rating_count: "a:0:{}", _wc_average_rating: "0", …}

我想处理每个“索引”（89,91，....），然后将它们一个一个地发送到我的React组件。

例如，我的React组件将使用的第一件事是

{名称：“印度香Conf”，product_id：“ 737”，_ wc_review_count：“ 0”，_ wc_rating_count：“ a：0：{}”，_ wc_average_rating：“ 0”，…}

我已经尝试过使用地图功能，但是它不起作用：

{this.state.Products.map((product, i) => {
                        return (
                            <div>
                            <Product product_data={product}/>
                            </div>
                        );
})}

谢谢您的帮助，并告诉我是否需要更多信息

Answer 1

获取对象的值。

{
  Object.values(this.state.Products).map((product, i) => {
    return (
      <div>
        <Product product_data={product}/>
      </div>
    );
  })
}

Answer 2

您有一个对象而不是数组。

从对象创建数组：

Row name    day         url statistic    
1   a       2011-05-16  b   100  
2   a       2011-05-16  e   90   
3   a       2014-04-01  h   150  
4   a       2014-04-01  d   120  
5   b       2011-05-16  k   11   
6   b       2011-05-16  m   9    
7   b       2014-04-01  p   15   
8   b       2014-04-01  l   12   

大量产品：

const products = Object.values(this.state.products);

让我知道你过得怎么样。

-

IMO：我将散布数据，然后在组件中访问products.map(item => <Product product_data={item}/>) 中的每个名称。

示例：

<Product />

然后在组件products.map(item => <Product {...item} />) 中：

<Product />