реагировать на собственный вызов функции жирной стрелки после setState: функция не определена - PullRequest
0 голосов
/ 16 марта 2019

При нажатой кнопке мое приложение вызывает функцию handlePress, которая возвращает случайные объекты из массива.

handlePress функция:

handlePress = () => {
      this.setState({
        vitamin: getRandomIngredient(vitaminArray),
      }, ()=> matchMealPreference())
    }

Если я заменю matchMealPreference () на console.log (), он будет работать нормально.

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

Функция matchMealPreference выглядит следующим образом:

matchMealPreference = () => {
      if(this.props.mealPreference === this.state.protein.getIngredientFlag()){
        return state
      } else {
        handlePress()
      }
    }

Функция для получения случайного объекта из массива:

function getRandomIngredient (arr){
  if (arr && arr.length) {
    return arr[Math.floor(Math.random() * arr.length)];
  }
}

Я получаю сообщение об ошибке:

reference error. matchMealPreference is not defined 

Я почти уверен, что упускаю что-то тривиальное. Но я застрял в этой проблеме уже более суток, поэтому я решил обратиться к вам за помощью.

  • Есть ли другой способ вызова matchMealPrefence без возникновения асинхронных проблем?

  • Можно ли вообще вызывать функцию в позиции, где вызывается matchMealPreference?

  • Разумно ли снова вызывать функцию handlePress внутри функции matchMealPrefence?

Любая помощь очень ценится

Редактировать: Виджай Менон ответил правильно. Мне нужно было добавить «это». Спасибо!

1 Ответ

0 голосов
/ 16 марта 2019

Вы должны ссылаться на "matchMealPreference" с ключевым словом "this" внутри setState. Вы должны сделать то же самое для вызова «handlePress» внутри функции «matchMealPreference»

https://codesandbox.io/s/542919430l

   changeStr = () => {
     this.setState({str:"Changed"})
   }
    click = () => {
      this.setState({num:this.state.num+1},() => {
        this.changeStr()
      })
    }
...