FlatList 核心运用
<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 核心运用的更多相关文章
- [RN] react-native FlatList 实现列表选中的最佳方式(刷新指定Item)
效果如下: 核心思路就是往数据源里面 给每条数据加一个选中状态. 如图在网络请求完成之后,给每条数据添加一个select的状态: data.list.forEach(item => item.s ...
- [RN] React Native FlatList跳转到顶部/底部
React Native FlatList跳转到顶部/底部 核心代码如下: <ScrollView showsVerticalScrollIndicator={false} contentCon ...
- Asp.Net WebApi核心对象解析(下篇)
在接着写Asp.Net WebApi核心对象解析(下篇)之前,还是一如既往的扯扯淡,元旦刚过,整个人还是处于晕的状态,一大早就来处理系统BUG,简直是坑爹(好在没让我元旦赶过来该BUG),队友挖的坑, ...
- 如何一步一步用DDD设计一个电商网站(一)—— 先理解核心概念
一.前言 DDD(领域驱动设计)的一些介绍网上资料很多,这里就不继续描述了.自己使用领域驱动设计摸滚打爬也有2年多的时间,出于对知识的总结和分享,也是对自我理解的一个公开检验,介于博客园这个平 ...
- 如何一步一步用DDD设计一个电商网站(三)—— 初涉核心域
一.前言 结合我们本次系列的第一篇博文中提到的上下文映射图(传送门:如何一步一步用DDD设计一个电商网站(一)—— 先理解核心概念),得知我们这个电商网站的核心域就是销售子域.因为电子商务是以信息网络 ...
- JS核心系列:浅谈原型对象和原型链
在Javascript中,万物皆对象,但对象也有区别,大致可以分为两类,即:普通对象(Object)和函数对象(Function). 一般而言,通过new Function产生的对象是函数对象,其他对 ...
- JS核心系列:浅谈 call apply 与 bind
在JavaScript 中,call.apply 和 bind 是 Function 对象自带的三个方法,这三个方法的主要作用是改变函数中的 this 指向,从而可以达到`接花移木`的效果.本文将对这 ...
- 浅谈 jQuery 核心架构设计
jQuery对于大家而言并不陌生,因此关于它是什么以及它的作用,在这里我就不多言了,而本篇文章的目的是想通过对源码简单的分析来讨论 jQuery 的核心架构设计,以及jQuery 是如何利用javas ...
- ASP.NET Core的路由[2]:路由系统的核心对象——Router
ASP.NET Core应用中的路由机制实现在RouterMiddleware中间件中,它的目的在于通过路由解析为请求找到一个匹配的处理器,同时将请求携带的数据以路由参数的形式解析出来供后续请求处理流 ...
随机推荐
- 快速安装 Laravel 5.7
$ git clone https://github.com/laravel/laravel.git $ cd laravel $ cp .env.example .env $ composer in ...
- MySQL触发器在建立时,报语法错的问题
delimiter $$ create trigger trg_delete_on_users before DELETE on users for each row begin delete fro ...
- js之数组操作
js之数组操作 前言 本文主要从应用来讲数组api的一些操作,如一行代码扁平化n维数组.数组去重.求数组最大值.数组求和.排序.对象和数组的转化等.(文章摘自:https://segmentfault ...
- 物理层PHY 和 网络层MAC
PHY模块简介 物理层位于OSI最底层,物理层协议定义电气信号.线的状态.时钟要求.数据编码和数据传输用的连接器. 物理层的器件称为PHY. 上图里的灰色方框图里的就是PHY芯片内部模块图. MAC器 ...
- UIPresentationController - iOS自定义模态弹出框
参考: https://developer.apple.com/library/archive/featuredarticles/ViewControllerPGforiPhoneOS/Definin ...
- ERROR internal error: process exited while connecting to monitor
centos7.4 创建kvm虚拟机时报错 问题: [root@oldboy ~]# virt-install --virt-type kvm --os-type=linux --os-variant ...
- js三种弹出框的用法
https://blog.csdn.net/cui_angel/article/details/7784211 js中prompt()的用法
- Java构造器与构建器的使用
我们在平常类的构建过程中,可能会面临很多问题,可扩张性.安全性等等.想象一下,这样一个场景,我们现在要创建一个类,其中有6个属性,其中又有4个属性的值是不太确定的(可能某个对象就不需要其中的某个值), ...
- ES6中的类和继承
class的写法及继承 JavaScript 语言中,生成实例对象的传统方法是通过构造函数.下面是一个例子 function Point(x, y) { this.x = x; this. ...
- P3321 [SDOI2015]序列统计
思路 首先有个挺显然的DP \[ dp[i][(j*k)\%m]+=dp[i-1][j]\times dp[i-1][k] \] 想办法优化这个DP 这个dp也可以写成这样 \[ dp[i][j]=\ ...