时间戳

首页 > 解决方案 > 无法读取以下 JSON 对象，即使元素存在也给出未定义

javascript - 无法读取以下 JSON 对象，即使元素存在也给出未定义

问题描述

我有以下对象（在内部操作了一些点之后）我称之为 props.stuff ，给定：数据从父组件传递给子组件

//Parent
componentDidMount() {
    this.getData();
  }

  async getData() {
    const res = await axios.get(
      "{link here}"
    );
    const { data } = await res;
    this.setState({ stuff: data});
  }

<Child props={this.state.stuff} />

所以，当我这样做时，在 Child 中console.log(props.stuff)：

props.stuff= {
"date":"November 14",
"status":"PENDING",
"id":"146859",
"invoice_number":"123685479624",
"amount":"950.00",
"currency":"$"
}

但是尝试访问 props.stuff.date （或类似 props.stuff. {element}的任何东西）会给我undefined。我究竟做错了什么？

注意：我通过执行 console.log(JSON.stringify(props.stuff)) 得到了下面的字符串，所以这正是它的本质。

标签： javascriptjsonreactjsstring

解决方案

所以我终于想出了解决方案。实际上 props 是从父组件传递给子组件的，而在父组件中，它是通过 API 调用获取的。所以 props 的初始值是不确定的。

在父组件中，编写：

{props.stuff && <Child stuff={props.stuff} />}

这确保了 props 仅在存在时才传递，从而解决了问题

推荐阅读