Я вызываю данные из этого API https://api.themoviedb.org/3/discover/movie?api_key=9a4a662a126525b07d4b84b079d809d8&language=en-US&sort_by=popularity.asc&include_adult=false&include_video=
и получение URL-адреса, чтобы я мог получить данные для отображения на мобильном устройстве, проблема в библиотеке native-base, компонент List устарел, поэтому в документации сказано, что следует использовать Flatlist Component из официального реактивного кода, а здесь код:
// render data list
renderDataMovieList = ({ movieItem }) => {
return(
<ListItem Thumbnail>
<Left>
<Thumbnail square large source= {{ uri:"https://image.tmdb.org/t/p/w500" + movieItem.poster_path }}/>
<Body>
<Text>{ movieItem.title }</Text>
<Text note >Release Date : { movieItem.release_date }</Text>
<Text note >Vote Avarage : { movieItem.vote_average }</Text>
<Text note >Language : { movieItem.original_language}</Text>
</Body>
</Left>
<Button transparent>
<Icon name="arrow-forward" style={{ color: "#999" }}/>
</Button>
</ListItem>
);
}
render(){
return(
<Container>
<Header>
<Left>
<Button transparent>
<Icon name="menu" />
</Button>
</Left>
<Body>
<Title>Movie List</Title>
</Body>
<Right />
</Header>
<Content>
<FlatList
data = { this.state.data }
renderItem = { this.renderDataMovieList}
keyExtractor={ movieItem => movieItem.id }
onEndReached={this.handleLoadMore}
onEndReachedThreshold={0.5}
initialNumToRender={5}
/>
</Content>
</Container>
);
}
Но после того, как я запустил этот код, я получаю эту ошибку
Ошибка типа: undefined не является объектом (оценка 'movieItem.poster_path')
Я следовал этому шаблону кода: http://docs.nativebase.io/docs/examples/FlatListExample.html
но я все еще получаю ошибку.
Я предполагаю, что movieItem не определен (вот почему ошибка).
В идеале вам следует дождаться завершения вызова фильма, а затем вызвать компонент, а также вы не передаете данные movieItem в метод renderDataMovieList.
Предполагая, что movieItem - это данные, которые вы ждете.
{ movieItem &&
<FlatList
data = { this.state.data }
renderItem = { this.renderDataMovieList({ movieItem: movieItem }) }
keyExtractor={ movieItem => movieItem.id }
onEndReached={this.handleLoadMore}
onEndReachedThreshold={0.5}
initialNumToRender={5}
/>
}
this.renderDataMovieList(movieItem)
и при получении renderDataMovieList = (movieItem) => {
movieItem
?