Не удается получить доступ к this.setState во втором вызове API во вложенных вызовах (AWS Amplify Storage API) (React Native) - PullRequest
Новая
       13

Не удается получить доступ к this.setState во втором вызове API во вложенных вызовах (AWS Amplify Storage API) (React Native)

0 голосов
/ 06 февраля 2019
  • Первый вызов (Storage.list ('s3 bucket path')) возвращает список ключей.
  • Для каждого ключа я делаю второй вызов (Storage.get ('key')), который возвращает URL
  • Внутри первого и второго вызова API, я console.log и получаю правильныйданные мне нужны для каждого.
  • this.setState прекрасно работает внутри первого вызова API, но не во втором.

Мой код: 

    state = { keyItems: [], urlItems: [] }

    componentDidMount() {
        Storage.list('')
          .then(keyItems => {
            console.log("keyItems: ", keyItems)
            this.setState({ keyItems: keyItems })

            /*for each photo key in the folder..*/
            keyItems.forEach(function(keyItem) {
              /*get the URL*/
              Storage.get(keyItem.key)
                .then(urlItem => {
                  console.log("urlItem: ", urlItem)
                  /*add URL item to state*/
                  /*ANY CALL TO this.setState HERE DOESN'T WORK, i've tried 
                  even simple tests*/
                  this.setState(prevState => ({ urlItems:[...prevState.urlItems, { key: keyItem.key, source: urlItem } ]}))
                })
                .catch(err => {
                  console.log("error fetching photo URL", err)
                })
            })
          })
          .catch(err => {
            console.log("error fetching photos keys", err)
          })
      }

Консоль: Console

  • Я пытался делать вызовы от функций со стрелками за пределами componentDidMount, но все еще не могу получить доступ к this.setState

Спасибо!

1 Ответ

0 голосов
/ 06 февраля 2019

Значение this теряется внутри .then

. Вы можете попробовать это

  1. Установить this в переменную
  2. Использоватьэта переменная вместо this

Вот она в коде 

componentDidMount () {
  const that = this;

  // now call setState like this
  that.setState(...)

}

Вы можете узнать больше об этом по ссылке ниже, но я изложил общую суть этогоздесь.

this всегда является объектом, к которому вызывается метод.Однако при передаче метода в then() вы не вызываете его!Метод будет где-то сохранен и позже вызван оттуда.

Почему «this» не определено внутри метода класса при использовании обещаний?

...