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

标签 javascript arrays reactjs jsx associative

访问对象内部的数据以将其发送到 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 组件将使用的第一件事是

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

我试过像这样使用 map 功能,但它不起作用:


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

如果你能帮助我,谢谢,如果你需要更多信息,请告诉我

最佳答案

获取对象的值。

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

关于javascript - 将数据从对象发送到 React 组件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56602239/

相关文章:

javascript - 通过 axios 使用 vuex 获取文章 ID

javascript - 范围错误 : Maximum call stack size exceeded in node_modules -> elasticsearch

java - 以java快速方式写入/读取 float 组

javascript - JavaScript 中关联数组的键排序和索引访问

javascript - 堆栈导航器给我未定义的错误

javascript - 为什么在 React 中为一个组件同时创建 index.js 和 Component.js?

javascript - 在 HTML 表格中显示选定行/单元格的 X 和 Y 值

javascript - 为什么表单文本输入的 parseFloat(value) 给出 NaN?

c - 阻止分配给数组的理由是什么?

javascript - react native 自定义表单验证