Реагировать AJAX после запроса не go на метод успеха / ошибки - PullRequest
Новая
       9

Реагировать AJAX после запроса не go на метод успеха / ошибки

0 голосов
/ 12 апреля 2020

У меня есть React Component, который вызывает AJAX POST-запрос. Запрос POST создает запись в базе данных, как и ожидалось. (возвращен статус 201) Однако методы успеха / ошибки не вызываются. 

$.ajax({
            url: '/api/put/comment/',
            dataType: 'json',
            type: 'POST',
            data: comment,
            beforeSend: function(xhr) {
                console.log('before send');
                xhr.setRequestHeader('X-CSRFToken', getCookie('csrftoken'));
            },
            success: function(data) {
                console.log('success');
                this.loadData();
            },
            error: function(xhr, status, err) {
                console.log('error');
                this.setState({data:comments});
                console.error(this.props.url, status, err.toString());
            }
        });

Запрос вызывается нажатием кнопки. Кроме того, браузер зависает, как только запрос сделан, и решение состоит в том, чтобы открыть новую вкладку.

Также я не вижу POST-запрос на вкладке Network Chrome, но вижу его на бэкэнде. Есть намеки?

1 Ответ

0 голосов
/ 12 апреля 2020

Попробуйте использовать функции стрелок ES6 или свяжите свои функции с помощью this

$.ajax({
            url: '/api/put/comment/',
            dataType: 'json',
            type: 'POST',
            data: comment,
            beforeSend:(xhr) => {
                console.log('before send');
                xhr.setRequestHeader('X-CSRFToken', getCookie('csrftoken'));
            },
            success:(data) => {
                console.log('success');
                this.loadData();
            },
            error:(xhr, status, err) => {
                console.log('error');
                this.setState({data:comments});
                console.error(this.props.url, status, err.toString());
            }
        });
...