Невозможно прочитать следующий JSON объект, дает неопределенный, даже если элемент существует

Question

У меня есть следующий Объект (после некоторой точки, работающей внутри), я назвал его 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)), так что это именно то, что есть.

Answer 1

Так что я наконец-то нашел решение. На самом деле реквизиты передавались дочернему компоненту из родительского компонента, а в родительском компоненте он вызывался через вызов API. Таким образом, начальное значение реквизита было неопределенным.

В родительском компоненте было написано:

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

Это обеспечило передачу реквизита только в том случае, если он существует, что устраняет проблему