React-Native:长列表

React-Native:ListView

React-Native提供了几个适用于展示长列表数据的组件，一般常用的有FlatList和SectionList两种。

FlatList显示一个垂直滚动的列表，元素个数可以增删。必须的两个属性是data和renderItem。data是列表的数据源，renderItem则从数据源中逐个解析数据，然后返回一个设定好格式的组件来渲染（类似于cell）。

import React, { Component } from 'react';
import { AppRegistry, FlatList, StyleSheet, Text, View } from 'react-native';

export default class FlatListBasics extends Component {
     render() {
        return (
          <View style={styles.container}>
            data={[
              {key: 'Zc'},
              {key: 'Zchen'},
              {key: 'Zjia'},
              {key: 'Zhha'},
            ]}
            renderItem={({item}) => <Text style={styles.item}>{item.key}</Text>}
          </View>
        );
     }
}