Реагировать - данные не найдены

Question

У меня есть главный компонент Resume и дочерний элемент Header:

class Resume extends Component {
      constructor(props) {
        super();
        this.state = {
          data: {}
        }
      }
      componentDidMount() {
        this.setState( this.state = data);
      }
      render() {
        return (
          <div className="Resume">
            <Header data={this.state.header} />
            <Skills data={this.state.skills} />
          </div>
        );
      }
    }
    export default Resume;

    class Header extends Component {
      render() {
        return (
          <div className="header">
            <h1>{JSON.stringify(this.props.data.title)}</h1>
          </div>
        );
      }
    }

My simple sample data so far is: 

{
  "header": {
    "title": "Tim Smith's Resume"
  },
  "skills": [
    {"name": "HTML", "duration": 14}
  ]
}

Почему я получаю: TypeError: Cannot read property 'title' of undefined

Answer 1

Похоже, вы неправильно устанавливаете состояние компонента <Resume/>. Попробуйте следующую настройку:

 componentDidMount() {
    // This will set the `data` field of your component state, to the 
    // value of the `data` variable.

    this.setState({ data : data });
  }

Answer 2

1. Не нужно использовать JSON#stringify ваше свойство title уже является строкой.

2. В вашем componentDidMount не так, что мы устанавливаем состояние. Попробуйте использовать

   componentDidMount() const data = {}; // Define data or get it like you want this.setState({ ...data }); }

3. В вашем конструкторе, где вы инициализируете свое состояние. Вы должны сделать this.state = { header: {}, skills: {} } не то, что вы сделали.