react-native 0.20.0 官方示例应用源代码

2016-02-22 13:43:00
hainuo
原创 2060
```/** * Sample React Native App * https://github.com/facebook/react-native */'use strict';import React, { AppRegistry, Component, Image, ListView, StyleSheet, Text, View,} from 'react-native';var REQUEST_URL = 'https://raw.githubusercontent.com/facebook/react-native/master/docs/MoviesExample.json';class pg extends Component { constructor(props) { super(props); this.state = { dataSource: new ListView.DataSource({ rowHasChanged: (row1, row2) => row1 !== row2, }), loaded: false, } } componentDidMount() { this.fetchData(); } fetchData() { fetch(REQUEST_URL) .then((response) => response.json()) .then((responseData) => { this.setState({ dataSource: this.state.dataSource.cloneWithRows(responseData.movies), loaded: true, }); }) .done(); } render() { if (!this.state.loaded) { return this.renderLoadingView(); } return ( ); } renderLoadingView() { return ( Loading movies... ); } renderMovie(movie) { return ( {movie.title} {movie.year} ); }}const styles = StyleSheet.create({ container: { flex: 1, flexDirection: 'row', justifyContent: 'center', alignItems: 'center', backgroundColor: '#F5FCFF', }, thumbnail: { width: 53, height: 81, }, rightContainer: { flex: 1, }, title: { fontSize: 20, marginBottom: 8, textAlign: 'center', }, year: { textAlign: 'center', }, listView: { paddingTop: 20, paddingLeft:20, paddingRight:20, backgroundColor: '#F5FCFF', borderBottomWidth:1, borderBottomColor:'#333', },});AppRegistry.registerComponent('pg', () => pg);```
发表评论
柒 减 零 =
评论通过审核后显示。