Ссылка РЕАКТИРОВАТЬ данные о состоянии на другой странице показывает ошибку неопределенную

Question

Я новичок в React и сталкиваюсь с трудностями при доступе к данным, переданным из Link на другую страницу.

Я на главной странице, у меня есть ссылка, по которой я перенаправляю на другую страницу или компонент (тестовую страницу) с именем штата и возрастом. Но я не могу получить данные на тестовой странице. Ниже приведен код, который я пробовал.

<Link
  to={{
    pathname: "/testpage",
    state: {
      Testname: {
        name: "im test",
        age: 20
      }
    }
  }}
>
  Hi test
</Link>

Я хочу получить доступ к состоянию в компоненте тестовой страницы. Таким образом, на тестовой странице мой код выглядит так:

import React, { PureComponent } from "react";

class Testpage extends PureComponent {
  componentDidMount() {
    const { Testname } = this.props.location.state.Testname;
    console.log(Testname);
  }
}

Но я получаю сообщение об ошибке

Невозможно прочитать свойство 'Testname' из неопределенного

Answer 1

Вы разрушаете с Testname. Вы должны деструктурировать с state

Это должно быть:

import React, { PureComponent } from "react";

class Testpage extends PureComponent {
  componentDidMount() {
    const { Testname } = this.props.location.state;
    console.log(Testname);
  }
}