Невозможно отобразить обещанный ответ для html div

Question

У меня есть прямоугольный компонент, в методе которого componentDidMount которого я обновляю переменную состояния компонента, и эта переменная состояния используется в методе рендеринга для отображения в пользовательском интерфейсе. но мой div всегда пуст, и на консоли я вижу ошибку. Ниже мой компонент и js-файлы содержимого

App.js

componentDidMount () {
    ...
    this.someInternalMethod()
}

someInternalMethod() {
    someApiCall().then(result => {
      this.state.divContent.setContent(result)
    })
}

apiHelper.js

export function someApiCall() {

    // Build the api endpoint
    var url = "http://someurl";

    fetch(url).then(function(response) {
        if (response.status !== 200) {
          return;
        }
        response.json().then(function(data) {
            //this log is printing data after error 
          console.log(data);
          return formattedHtmlData(data));
        });
    }).catch(function(err) {
       console.log("Sorry data can't be loaded");
    });
}

Formatter.js

export function formattedHtmlData(data) {

    //do html formatting of data put inside div etc.
    and return
}

Не могу понять, чего мне не хватает. Любая помощь приветствуется.

PS: этот вопрос уже передан в стеке потока - получить значение обещания в компоненте реакции

Answer 1

Убедитесь, что вы отвечаете как на fetch, так и на response.json() вызовы, иначе цепочка обещаний будет разорвана, и вам не будет обещано использовать then в someInternalMethod.

export function someApiCall() {
  // Build the api endpoint
  var url = "http://someurl";

  return fetch(url)
    .then(function(response) {
      if (response.status !== 200) {
        return;
      }
      return response.json().then(function(data) {
        //this log is printing data after error
        console.log(data);
        return formattedHtmlData(data);
      });
    })
    .catch(function(err) {
      console.log("Sorry data can't be loaded");
    });
}