ajax調用后無法更新類變量

Question

在ajax請求完成后得到兩個整數后，即使dims已正確解碼， this.N和this.M也不會被storeDims()設置。 所以我似乎無法this.N和this.M在構造函數中聲明。 這是代碼

class MapModel {

    constructor() {
        this.N; // need to initialize this after an ajax call
        this.M;
        this.seats = new Array();
        this.remote_seats = new Array();
    }

    init(callback) {
        let _this = this;
        $.when(
            _this.getDims(),
            _this.getSeats(),
        ).then(this.initMap(callback))
    }


    initMap(callback) {
        console.log(this.N); // prints undefined
        console.log(this.M); // this as well
        callback(this.N, this.M, this.seats);
    }

    getDims() {
        let _this = this;
        $.ajax({
            url: 'src/php/data.php',
            type: 'POST',
            data: {action: 'getDims'},
            success: function (result) {
                let dims = JSON.parse(result); // dims[0] = 10, dims[1] = 6
                _this.storeDims(dims);
            }
        });
    }

    storeDims(dims) {
        console.log(dims);
        this.N = parseInt(dims[0]);
        this.M = parseInt(dims[1]);
        console.log(this.N);
        console.log(this.M);
    }

    getSeats() {
    let _this = this;
    $.ajax({
        url: 'src/php/data.php',
        type: 'POST',
        data: {action: 'getSeats'},
        success: function (result) {
            let seats = JSON.parse(result);
            _this.storeSeats(seats);
        }
    });
}

storeSeats(seats) {
    this.remote_seats = seats;
    console.log(this.remote_seats);
}
}

Answer 1

您需要從getDms和getSeats函數返回ajax promise

 getDims() {
        let _this = this;
        return $.ajax({
            url: 'src/php/data.php',
            type: 'POST',
            data: {action: 'getDims'},
            success: function (result) {
                let dims = JSON.parse(result); // dims[0] = 10, dims[1] = 6
                _this.storeDims(dims);
            }
        });
    }

您甚至可以將值直接傳遞給initMap

init(callback) {
        let _this = this;
        $.when(
          _this.getDims(),
          _this.getSeats()
        ).then(function(dims,seats) {_this.initMap(dims,seats,callback)})
    }


    initMap(dimsRaw,seatsRaw, callback) {
        let dims = JSON.parse(dimsRaw);
        console.log(dims[0]); 
        console.log(dims[1]); 
        callback(dims[0], dims[1], this.seats);
    }

Answer 2

在鏈聲明上調用init promise回調，嘗試添加一個函數包裝器：

    init(callback) {
        let _this = this;
        $.when(
            _this.getDims(),
        ).then(function() {_this.initMap(callback)})
    }