Skip to content

Instantly share code, notes, and snippets.

@martink-io
Created September 26, 2018 13:44
Show Gist options
  • Save martink-io/6649890a8a427a03b15bcde05544ab10 to your computer and use it in GitHub Desktop.
Save martink-io/6649890a8a427a03b15bcde05544ab10 to your computer and use it in GitHub Desktop.
import React from 'react';
import { FlatList, ActivityIndicator, Text, View } from 'react-native';
export default class FetchExample extends React.Component {
constructor(props){
super(props);
this.state ={ isLoading: true}
}
componentDidMount(){
return fetch('https://facebook.github.io/react-native/movies.json')
.then((response) => response.json())
.then((responseJson) => {
this.setState({
isLoading: false,
dataSource: responseJson.movies,
}, function(){
});
})
.catch((error) =>{
console.error(error);
});
}
render(){
if(this.state.isLoading){
return(
<View style={{flex: 1, padding: 20}}>
<ActivityIndicator/>
</View>
)
}
return(
<View style={{flex: 1, paddingTop:20}}>
<FlatList
data={this.state.dataSource}
renderItem={({item}) => <Text>{item.title}, {item.releaseYear}</Text>}
keyExtractor={({id}, index) => id}
/>
</View>
);
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment