ReactJS & Flux получить данные из обещания

Question

Я пытаюсь получить данные с сервера с функцией сервиса, которые я нашел в проекте designjs template. Я получаю совершенно отличный anwser с сервера, я вижу, что массивы в порядке, все еще находясь в сервисе, но не при передаче компоненту, который вызвал его в первую очередь. В компоненте я получаю объект обещания, который имеет значения (я видел их в консоли), но я не могу получить к ним доступ. Что мне не хватает?

Мой компонент имеет следующие функции:

calculate(dict) { 
    var results = Service.calc(dict) 
     .catch((err) => { 
      var errResp = JSON.parse(err.response); 
      console.log(errResp); 
      this.setState({responseErrors: errResp}); 
    }); 
    this.setState({results:results._handler}); 
} 

Когда я напечатал результаты в консоль я увидел объект Promise, внутри _handler.handler был массив значения со своими значениями, но я не мог их использовать. Ошибка при доступе к результату ._handler.handler: undefined.

Вызываемый службы выглядит следующим образом:

class Service { 
    calc(dict) { 
    return this.handleCalculate(when(request({ 
     url: UserConstants.URL, 
     method: 'POST', 
     type: 'json', 
     data: dict 
    }))); 
} 

handleCalculate(calcPromise) { 
    return calcPromise.then(
     function(data) { 
      console.log(data); //Success 
      return data; 
     } 
    ) 
} 

Тем временем я использую Ajax вызова непосредственно в компоненте вместо службы. Но я понимаю, что это плохая практика, как я могу это исправить?

Answer 1

Привет, в основном вы ставите setState в неправильном месте. (Он сразу устанавливает состояние, не дожидаясь разрешения на получение результата). Это должно выглядеть так:

calculate(dict) { 
    var results = Service.calc(dict) 
     .then(results => { 
     this.setState({results: results}); 
     }) 
     .catch((err) => { 
      var errResp = JSON.parse(err.response); 
      console.log(errResp); 
      this.setState({responseErrors: errResp}); 
    }); 
}