Почему обещание равно «неопределенное»?

0

Я пытаюсь создать простой загрузчик, который при вызове вызывает API, который возвращает данные

requestData(pageSize, page, sorted, filtered){
    console.log(filtered);
    var url = 'http://www.myurl.com/getProducts?start=${page*pageSize}&end=${page*pageSize+pageSize}';
    var r = new XMLHttpRequest();
    r.onreadystatechange = function () {
        return new Promise((resolve, reject) =>{
            if (r.readyState != 4 || r.status != 200){
                reject(r);
            } else {
                resolve(r.responseText);
            }
        })
    };
    r.open("GET", url, true);
    r.send(null);
};

fetchData(state, instance) {
    this.setState({ loading: true });

    this.requestData(
      state.pageSize,
      state.page,
      state.sorted,
      state.filtered
    ).then(res => {
        this.setState({
          data: res.rows,
          pages: res.pages,
          loading: false
        });
    });
}

Обе эти функции находятся в компоненте React. Проблема заключается в последнем.then(), который вызывается на объект "undefined". Почему мое обещание вернулось неправильно?

  • 1
    requestData ничего не возвращает.
Теги:
xmlhttprequest
promise

2 ответа

3

Потому что вы никогда не возвращаете ничего из requestData. Вы просто возвращаете обещание в функцию обратного вызова, которая не попадает в никуда. Вместо того, чтобы обернуть обещание в обратный вызов, вы должны обернуть обратный вызов в обещание:

function  requestData(pageSize, page, sorted, filtered){
   return new Promise((resolve, reject) =>{
     console.log(filtered);
     var url = 'http://www.myurl.com/getProducts?start=${page*pageSize}&end=${page*pageSize+pageSize}';
    var r = new XMLHttpRequest();

    r.onreadystatechange = function () {        
        if (r.readyState != 4 || r.status != 200){
            reject(r);
        } else {
            resolve(r.responseText);
        }

    };
    r.open("GET", url, true);
    r.send(null);
 });
}
0

Это потому, что функция requestData ничего не возвращает. Вы должны вернуть объект Promise, как это

requestData(pageSize, page, sorted, filtered){
    return new Promise((resolve, reject) => {
        console.log(filtered);
        var url = 'http://www.myurl.com/getProducts?start=${page*pageSize}&end=${page*pageSize+pageSize}';
        var r = new XMLHttpRequest();
        r.onreadystatechange = () => {
            if (r.readyState != 4 || r.status != 200){
                reject(r);
            } else {
                resolve(r.responseText);
            }
        }

        r.open("GET", url, true);
        r.send(null);
    });
}

Ещё вопросы

Сообщество Overcoder
Наверх
Меню