<FlatList
data={this.state.stuList}
renderItem={this._renderItem}
keyExtactor={this._keyExtractor}
ItemSeparatorComponent={this._separator}
/>
this.state={
stuList:[{},{},{}]
}
_renderItem=({item})=>{
return ( <View>..</View>);
}
_keyExtractor=({item,index})=>{
return ( item.key.tostring());
}
_separator=>{
return( <View style={{height:1,backgroundColor:'#FFFFFF'}}/>);
}

运用上面的控件 就可以有下拉 和上滑 的效果 比如QQ里的刷新 和 网页里的加载

data,是一个多个对象的数组,在状态里用[] 添加

renderItem 是呈现在界面的代码段  几个对象就会出现几次

keyExtator 是一个对item的转义字段

ItemSaparaComponent 是一个用来间隔 <View> 的<View>

上面是代码的官方截图

下面是一个简单案例的效果图片

FlatList 核心运用的更多相关文章

  1. [RN] react-native FlatList 实现列表选中的最佳方式(刷新指定Item)

    效果如下: 核心思路就是往数据源里面 给每条数据加一个选中状态. 如图在网络请求完成之后,给每条数据添加一个select的状态: data.list.forEach(item => item.s ...

  2. [RN] React Native FlatList跳转到顶部/底部

    React Native FlatList跳转到顶部/底部 核心代码如下: <ScrollView showsVerticalScrollIndicator={false} contentCon ...

  3. Asp.Net WebApi核心对象解析(下篇)

    在接着写Asp.Net WebApi核心对象解析(下篇)之前,还是一如既往的扯扯淡,元旦刚过,整个人还是处于晕的状态,一大早就来处理系统BUG,简直是坑爹(好在没让我元旦赶过来该BUG),队友挖的坑, ...

  4. 如何一步一步用DDD设计一个电商网站(一)—— 先理解核心概念

    一.前言     DDD(领域驱动设计)的一些介绍网上资料很多,这里就不继续描述了.自己使用领域驱动设计摸滚打爬也有2年多的时间,出于对知识的总结和分享,也是对自我理解的一个公开检验,介于博客园这个平 ...

  5. 如何一步一步用DDD设计一个电商网站(三)—— 初涉核心域

    一.前言 结合我们本次系列的第一篇博文中提到的上下文映射图(传送门:如何一步一步用DDD设计一个电商网站(一)—— 先理解核心概念),得知我们这个电商网站的核心域就是销售子域.因为电子商务是以信息网络 ...

  6. JS核心系列:浅谈原型对象和原型链

    在Javascript中,万物皆对象,但对象也有区别,大致可以分为两类,即:普通对象(Object)和函数对象(Function). 一般而言,通过new Function产生的对象是函数对象,其他对 ...

  7. JS核心系列:浅谈 call apply 与 bind

    在JavaScript 中,call.apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果.本文将对这 ...

  8. 浅谈 jQuery 核心架构设计

    jQuery对于大家而言并不陌生,因此关于它是什么以及它的作用,在这里我就不多言了,而本篇文章的目的是想通过对源码简单的分析来讨论 jQuery 的核心架构设计,以及jQuery 是如何利用javas ...

  9. ASP.NET Core的路由[2]:路由系统的核心对象——Router

    ASP.NET Core应用中的路由机制实现在RouterMiddleware中间件中,它的目的在于通过路由解析为请求找到一个匹配的处理器,同时将请求携带的数据以路由参数的形式解析出来供后续请求处理流 ...

随机推荐

  1. Jquery实现checkbox按shift多选

    html <html> <head> <meta http-equiv="content-type" content="text/html; ...

  2. 国际空间站直播 ISS直播

    b站:https://live.bilibili.com/9196015 斗鱼:https://www.douyu.com/543816 欢迎大家 (ฅ´ω`ฅ)

  3. 机器学习实战(笔记)------------KNN算法

    1.KNN算法 KNN算法即K-临近算法,采用测量不同特征值之间的距离的方法进行分类. 以二维情况举例:         假设一条样本含有两个特征.将这两种特征进行数值化,我们就可以假设这两种特种分别 ...

  4. 论文笔记:Deeper and Wider Siamese Networks for Real-Time Visual Tracking

    Deeper and Wider Siamese Networks for Real-Time Visual TrackingUpdated on 2019-04-01 16:10:37 Paper ...

  5. 深度学习环境搭建(ubuntu16.04+Titan Xp安装显卡驱动+Cuda9.0+cudnn+其他软件)

    一.硬件环境 ubuntu 16.04LTS + windows10 双系统 NVIDIA TiTan XP 显卡(12G) 二.软件环境 搜狗输入法 下载地址 显卡驱动:LINUX X64 (AMD ...

  6. Vivado 设计套件

    疑惑 有一天我在上网,逛着逛着看到一个叫https://pan.baidu.com/s/16Nu03YJLuz_aYuGQMm_8oQ的链接,那个网页的标题好像叫"Vivado 2017.4 ...

  7. ConcurrentHashMap为何不会出现ConcurrentModificationException异常

  8. Java面试题之Java基础

    1. JDK 和 JRE 有什么区别? JRE(JavaRuntimeEnvironment,Java运行环境),也就是Java平台.所有的Java 程序都要在JRE下才能运行.普通用户只需要运行已开 ...

  9. .net扩展方法

    http://www.cnblogs.com/landeanfen/p/4632467.html 看了博客才知道定义一个Util工具类并且在工具类里面写静态扩展方法并不是最好的选择.

  10. ggplot

    安装:install.packages("ggplot2") 加载:library(ggplot2) Plot(图)= data(数据集)+ Aesthetics(美学映射)+ G ...