Почему не изменяется состояние компонента?

Question

[fOrZe0]

Доброго времени суток. Появилась такая проблема. В методе componentDidMount() вызываю getData(), который, в свою очередь, обращается к серверу и ответ сервера кладёт в состояние. Но выполнение метода getData останавливается на след. части кода

this.setState({films: data}, () => {
     console.log(this.state.films);
});

Вот весь код

import React from "react";


export default class LibraryContent extends React.Component {
    films = [];

    constructor(props){
        super(props);

        this.state = {
            films: []
        };

        this.getData = this.getData.bind(this);

    }

    getData(){
        fetch('https://api.themoviedb.org/3/discover/movie?sort_by=popularity.desc&api_key=935************d58f&language=ru')
            .then(response => {
                    if (response.status !== 200) {
                        console.log('Код ошибки : ' +
                            response.status);
                        return;
                    }

                    // Examine the text in the response
                    response.json().then(function(data) {
                        console.log("Data : ");
                        console.log(data);

                        console.log("State: ");

                        this.setState({films: data}, () => {
                            console.log(this.state.films);
                        });
                        console.log("Эта строка в консоль уже не выводится");
                    });
                }
            )
            .catch(function(err) {
                console.log('Fetch Error :-S', err);
            });
    };

    componentDidMount(){
        this.getData();
    }

    render() {
        return (
            <div>
                Test
            </div>
        )
    }
}

Comments

[Роман Александрович]

так ответ от сервера вам приходит ?
вы смотрели в дебагере запросов?

[fOrZe0]

Роман Александрович, да, ответ приходит.

console.log("Data : ");
console.log(data);

Этот участок кода работает, выводит в консоль ответ сервера

Answer 1

[Кирилл Матросов]

Вы используете this.setState в function ,
response.json().then(function(data)
у которой свой this, а не this класса LibraryContent.

Надо заменить на стрелочную функцию, как выше
.then(response => {

console.log("Эта строка в консоль уже не выводится");

Это не выполняется, так выше у this нет setState, следовательно должна была произойти ошибка

this.setState is not a function

Comments

[fOrZe0]

Спасибо, это помогло.

[Максим]

fOrZe0, отметьте ответом, пожалуйста.

[fOrZe0]

Максим, забыл)