似乎无法访问数组中的对象属性

Question

控制台输出：{  295798: {    box_type: "QB",    color: "Assorted",    floor_allowed: 2100,    grade: false,    head_size: null,    is_special: "0",    length: false,    live_inventry: "1",  }}我有一个数组，显示在 chrome 控制台上面的屏幕截图中。当我打印出数组时，它出现了。console.log(props.thisData);console.log(props.thisData[0].color);props.thisData显示整个数组。但是，当我尝试访问颜色时，出现以下错误：Product.jsx:56 Uncaught TypeError: Cannot read property 'color' of undefined

Answer 1

控制台输出中的数据结构不是Array. 它Object以数字为键。似乎没有带键的元素0（0对象中没有属性）。因此，你得到未定义。

要访问您的颜色属性，您必须通过对象上的键访问它：

props.thisData['295798'].color

更新

如果您想使用数组，我建议您将对象转换为数组并将键作为 id 添加到每个元素。

const dataArray = Object
  .keys(props.thisData)
  .map(key => ({ id: key, ...props.thisData[key] }))