javascript - 对象键在循环映射 react 渲染中未定义

Question

我可以像这样访问整个对象

<Card.Content>{_this.state.index}</Card.Content>

它说不变违规:对象作为 React 子项无效(找到:带有键 {name, title, email, Phone, photo, officename, manageremail} 的对象)。

但这不是我的目标，我只是想渲染其中一个键

 const componentsMobile = this.state.components.map(item => (
      <Card fluid key={index}>
        <Card.Content>
          <Card.Header>{item.value.label}</Card.Header>
        </Card.Content>
        <Card.Content extra>{_this.state.index.email}</Card.Content>
        {/* <Card.Content extra>{_this.state.index.value[item.source]}</Card.Content> */}
      </Card>
 ))

index.cjs.js:798 Uncaught TypeError: Cannot read property 'email' of undefined

我不知道为什么它是未定义的

Answer 1

尝试将检查添加为 _this.state && _this.state.index && _this.state.index.email。

如果电子邮件存在，则会显示电子邮件，否则不会显示任何内容，也不会出现此错误。

您可以将解决方案直接放在您现在使用 _this.state.index.email 的位置。