Не удалось вызвать метод для FlatList renderRow?

Question

У меня есть простой FlatList со списком видео на YouTube, как показано ниже:

<FlatList 
  data={this.props.videoList}
  renderItem={this.renderRow}
  keyExtractor={(item) => item.id.videoId.toString()}
/>

И для каждой функции renderRow мне нужен вызов API для получения числа лайков из YOUTUBE APIи вернуть компонент, как показано ниже:

renderRow({ item }) {
  const something = this.getIndividualStatistics(item);
  return (<SomeComponent />);
}

И ниже находится функция для getIndividualStatistics

getIndividualStatistics = async item => {
  const { data } = await axios.get('youtubeAPI bla bla bla');
  return data;
}

И я получаю ошибку при попытке загрузить это FlatList

Answer 1

Вам необходимо связать renderRow в конструкторе, иначе this в renderRow будет ссылаться на себя:

constructor(props) {
  super(props);
  this.renderRow = this.renderRow.bind(this);
}

В качестве альтернативы можно объявить renderRow в качестве функции стрелки:

renderRow = ({ item }) => {

См. здесь для получения дополнительной информации.