Skip to content

Instantly share code, notes, and snippets.

@maowug
Created September 6, 2016 08:43
Show Gist options
  • Save maowug/34719634ac2844a71a5999c7740698fb to your computer and use it in GitHub Desktop.
Save maowug/34719634ac2844a71a5999c7740698fb to your computer and use it in GitHub Desktop.
fetch, enableEmptySections ?
import React, { Component } from 'react';
import {
AppRegistry,
StyleSheet,
Text,
View,
Image,
TextInput,
AlertIOS,
ScrollView,
ListView
} from 'react-native';
class ListViewBasics extends Component {
// Initialize the hardcoded data
constructor(props) {
super(props);
const ds = new ListView.DataSource({rowHasChanged: (r1, r2) => r1.title !== r2.title});
this.state = {
dataSource: ds.cloneWithRows([])
}
fetch('https://facebook.github.io/react-native/movies.json')
.then((response) => response.json())
.then((responseJson) => {
return responseJson.movies;
})
.catch((error) => {
console.error(error);
})
.then((movies) => {
this.setState({dataSource: ds.cloneWithRows(movies)})
})
}
async getMoviesFromApi() {
try {
let response = await fetch('https://facebook.github.io/react-native/movies.json');
let responseJson = await response.json();
return responseJson.movies;
} catch(error) {
console.error(error);
}
}
render() {
return (
<View style={{paddingTop: 100, flex:1}}>
<ListView
enableEmptySections
dataSource={this.state.dataSource}
renderRow={(m) => m && m.title ? <Text>{`${m.title} (${m.releaseYear})`}</Text> : <Text/> }
/>
</View>
);
}
}
AppRegistry.registerComponent('AwesomeProject', () => ListViewBasics);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment