React Native0.61之使用长列表

React Native提供了几个适用于展示长列表数据的组件，一般而言我们会替换 FlatList或SectionList。

FlatList组件用于显示一个垂直的滚动列表，其中的元素之间的结构近似而仅数据不同。

FlatList和ScrollView不同的是，FlatList并不立即渲染所有元素，而是优先渲染屏幕上可见的元素。

FlatList组件必须的两个属性是data和renderItem。data是列表的数据源，而renderItem则从数据源中逐个解析数据，然后返回一个设置好格式的组件来渲染。

下面的示例创建了一个简单的FlatList，并预定了一些模拟数据。首先是初始化FlatList所需的data，其中的每一项（行）数据之后都在renderItem中被渲染的Text组件，最后构成了整个FlatList。

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

export default class FlatListBasics extends Component {
  render() {
    return (
      
         {item.key}}
        />
      
    );
  }
}

const styles = StyleSheet.create({
  container: {
   flex: 1,
   paddingTop: 22
  },
  item: {
    padding: 10,
    fontSize: 18,
    height: 44,
  },
})

列表的一个常用场景就是从服务器端取回列表数据然后显示，要实现这一过程，你可能还需要学习React Native的网络相关用法。