Javascript 访问成员时，对象数组返回未定义

我试图从作为道具传递到无状态组件的对象数组中访问数组。例如，以下是场景：

const compA = props => {
  return (
     //other code
     console.log('CompA Arr: ', props.Arr)
     //I can clearly see the Array here before passing it as props
     <CompB props={props.Arr} />
  );

}
export default compA;

const compB = props => {
  return (
     //other code
     console.log('CompA Arr: ', props.Arr)
     //I can clearly see the Array now here, but below is undefined
     <input type="text" value={props && props[0].person && props[0].person[0].name}
  );

}
export default compB;

---

我试图访问person数组中的name字段，但是，这返回一个错误“无法读取未定义的'person'的属性。我缺少什么？我可以清楚地看到两个组件中的对象数组，但无法访问它们的成员。

您正在记录

props.Arr

但尝试访问

props[0]

？我也尝试过，但没有定义。如果我将鼠标悬停在Person对象上，控制台显示要访问它，您需要使用props[0]@usr41059。如果可能，您可以共享

console.log（'CompA Arr:'，props.Arr）

。这可能有助于解决您的问题。@SDushan这是输出props:[{…}]addressKey：“employee”required:true，如果我展开props对象，输出与上面相同。

props:[{...}]
//props expanded
0:
  id: 1
  position: "manager"
  person: [{...}]

//person expanded
0:
  name: "John Doe"
  age:  "40"