<FlatList
      data={this.state.dataList} extraData={this.state}
      refreshing={this.state.isRefreshing}
      onRefresh={() => this._onRefresh()}
      keyExtractor={(item, index) => item.id}
      ItemSeparatorComponent={() => <View style={{
        height: 1,
        backgroundColor: '#D6D6D6'
      }}/>}
      renderItem={this._renderItem}
      ListEmptyComponent={this.emptyComponent}/>
      
      
  //定义空布局
    emptyComponent = () => {
    return <View style={{
      height: '100%',
      alignItems: 'center',
      justifyContent: 'center',
    }}>
      <Text style={{
        fontSize: 16
      }}>暂无数据下拉刷新</Text>
    </View>
  }

 render() {
  if (this.props.legacyImplementation) {
   return (
    <MetroListView
     {...this.props}
     items={this.props.data}
     ref={this._captureRef}
    />
   );
  } else {
   return (
    <VirtualizedList
     {...this.props}
     renderItem={this._renderItem}
     getItem={this._getItem}
     getItemCount={this._getItemCount}
     keyExtractor={this._keyExtractor}
     ref={this._captureRef}
     onViewableItemsChanged={
      this.props.onViewableItemsChanged && this._onViewableItemsChanged
     }
    />
   );
  }
 }

  //省略部分代码
  const itemCount = this.props.getItemCount(data);
  if (itemCount > 0) {
    ....省略部分代码
  } else if (ListEmptyComponent) {
   const element = React.isValidElement(ListEmptyComponent)
    ? ListEmptyComponent // $FlowFixMe
    : <ListEmptyComponent />;
   cells.push(
    /* $FlowFixMe(>=0.53.0 site=react_native_fb,react_native_oss) This
     * comment suppresses an error when upgrading Flow's support for React.
     * To see the error delete this comment and run Flow. */
    <View
     key="$empty"
     onLayout={this._onLayoutEmpty}
     style={inversionStyle}>
     {element}
    </View>,
   );
  }

const inversionStyle = this.props.inverted
   ? this.props.horizontal
    ? styles.horizontallyInverted
    : styles.verticallyInverted
   : null;
   
样式：
verticallyInverted: {
  transform: [{scaleY: -1}],
 },
 horizontallyInverted: {
  transform: [{scaleX: -1}],
 },

//创建变量
fHeight = 0;

    <FlatList
      data={this.state.dataList} extraData={this.state}
      refreshing={this.state.isRefreshing}
      onRefresh={() => this._onRefresh()}
      keyExtractor={(item, index) => item.id}
      ItemSeparatorComponent={() => <View style={{
        height: 1,
        backgroundColor: '#D6D6D6'
      }}/>}
      renderItem={this._renderItem}
      onLayout={e => this.fHeight = e.nativeEvent.layout.height}
      ListEmptyComponent={this.emptyComponent}/>
      
      
  //定义空布局
    emptyComponent = () => {
    return <View style={{
      height: this.fHeight,
      alignItems: 'center',
      justifyContent: 'center',
    }}>
      <Text style={{
        fontSize: 16
      }}>暂无数据</Text>
    </View>
  }

state={
  fHeight:0
}

onLayout={e => this.setState({fHeight: e.nativeEvent.layout.height})}

           onLayout={e => {
             let height = e.nativeEvent.layout.height;
             if (this.state.fHeight < height) {
               this.setState({fHeight: height})
             }
           }}

      <FlatList
        data={this.state.dataList}
        extraData={this.state}
        refreshing={this.state.isRefreshing}
        onRefresh={() => this._onRefresh()}
        ItemSeparatorComponent={() => <View style={{
          height: 1,
          backgroundColor: '#D6D6D6'
        }}/>}
        renderItem={this._renderItem}
        ListEmptyComponent={this.emptyComponent}
        onEndReached={() => this._onEndReached()}
        onEndReachedThreshold={0.1}/>

  componentDidMount() {
    this._onRefresh()
  }

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

export const FlatListState = {
  IDLE: 0,
  LoadMore: 1,
  Refreshing: 2
};
export default class Com extends Component {
  static propTypes = {
    refreshing: PropTypes.oneOfType([PropTypes.bool, PropTypes.number]),
  };
  state = {
    listHeight: 0,
  }

  render() {
    var {ListEmptyComponent,ItemSeparatorComponent} = this.props;
    var refreshing = false;
    var emptyContent = null;
    var separatorComponent = null
    if (ListEmptyComponent) {
      emptyContent = React.isValidElement(ListEmptyComponent) ? ListEmptyComponent : <ListEmptyComponent/>
    } else {
      emptyContent = <Text style={styles.emptyText}>暂无数据下拉刷新</Text>;
    }
    if (ItemSeparatorComponent) {
      separatorComponent = React.isValidElement(ItemSeparatorComponent) ? ItemSeparatorComponent :
        <ItemSeparatorComponent/>
    } else {
      separatorComponent = <View style={{height: 1, backgroundColor: '#D6D6D6'}}/>;
    }
    if (typeof this.props.refreshing === "number") {
      if (this.props.refreshing === FlatListState.Refreshing) {
        refreshing = true
      }
    } else if (typeof this.props.refreshing === "boolean") {
      refreshing = this.props.refreshing
    } else if (typeof this.props.refreshing !== "undefined") {
      refreshing = false
    }
    return <FlatList
      {...this.props}
      onLayout={(e) => {
        let height = e.nativeEvent.layout.height;
        if (this.state.listHeight < height) {
          this.setState({listHeight: height})
        }
      }
      }
      ListFooterComponent={this.renderFooter}
      onRefresh={this.onRefresh}
      onEndReached={this.onEndReached}
      refreshing={refreshing}
      onEndReachedThreshold={this.props.onEndReachedThreshold || 0.1}
      ItemSeparatorComponent={()=>separatorComponent}
      keyExtractor={(item, index) => index}
      ListEmptyComponent={() => <View
        style={{
          height: this.state.listHeight,
          width: '100%',
          alignItems: 'center',
          justifyContent: 'center'
        }}>{emptyContent}</View>}
    />
  }

  onRefresh = () => {
    console.log("FlatList:onRefresh");
    if ((typeof this.props.refreshing === "boolean" && !this.props.refreshing) ||
      typeof this.props.refreshing === "number" && this.props.refreshing !== FlatListState.LoadMore &&
      this.props.refreshing !== FlatListState.Refreshing
    ) {
      this.props.onRefresh && this.props.onRefresh()
    }

  };
  onEndReached = () => {
    console.log("FlatList:onEndReached");
    if (typeof this.props.refreshing === "boolean" || this.props.data.length == 0) {
      return
    }
    if (!this.props.pageSize) {
      console.warn("pageSize must be set");
      return
    }
    if (this.props.data.length % this.props.pageSize !== 0) {
      return
    }
    if (this.props.refreshing === FlatListState.IDLE) {
      this.props.onEndReached && this.props.onEndReached()
    }
  };


  renderFooter = () => {
    let footer = null;
    if (typeof this.props.refreshing !== "boolean" && this.props.refreshing === FlatListState.LoadMore) {
      footer = (
        <View style={styles.footerStyle}>
          <ActivityIndicator size="small" color="#888888"/>
          <Text style={styles.footerText}>数据加载中…</Text>
        </View>
      )
    }
    return footer;
  }
}
const styles = StyleSheet.create({
  footerStyle: {
    flex: 1,
    flexDirection: 'row',
    justifyContent: 'center',
    alignItems: 'center',
    padding: 10,
    height: 44,
  },
  footerText: {
    fontSize: 14,
    color: '#555555',
    marginLeft: 7
  },
  emptyText: {
    fontSize: 17,
    color: '#666666'
  }
})