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中间件中,它的目的在于通过路由解析为请求找到一个匹配的处理器,同时将请求携带的数据以路由参数的形式解析出来供后续请求处理流 ...
随机推荐
- 小米5查看设备号信息及验证type-c数据线
首先,下载adb软件. 接着打开系统的开发者模式和调试模式. 打开cmd软件,切换到adb软件文件夹所在路径,输入命令:adb devices,则能看到设备的设备号信息. 如果设备号是00000001 ...
- Bugku-CTF之过狗一句话(送给大家一个过狗一句话)
Day25 过狗一句话 http://123.206.87.240:8010/ 送给大家一个过狗一句话<?php $poc="a#s#s#e#r#t"; $poc_1=e ...
- 在ubuntu的bash中循环执行脚本,并在内存不足时重启
#!/bin/bash date ma=`grep MemAvailable /proc/meminfo | awk '{print $2}'` echo MemAvailable = $ma run ...
- Flask Web框架
Flask依赖两个外部库:Werkzeug和Jinja2.Werkzeug是一个WSGI(在Web应用和多种服务器之间的标准Python接口)工具集:Jinja2负责渲染模板.所以在安装Flask之前 ...
- Flutter去除右上角Debug标签
void main(){ runApp(new MyApp()); } class MyApp extends StatefulWidget { @override _MyAppState creat ...
- LintCode 1.A+B的问题
LintCode 1.A+B的问题 描述 给出两个整数 a 和 b , 求他们的和. 答案 public class Solution { /** * @param a: An integer * @ ...
- centos, ubuntu 上docker 安装
参考中国官网,可以愉快的访问,各种系统,在线/离线部署都有说明.中文哦!! https://docs.docker-cn.com/engine/installation/linux/docker-ce ...
- 【使用指南】ComponentOne Enterprise .NET开发控件集
为方便广大 .NET开发人员更好的使用 ComponentOne Enterprise .NET开发控件集,葡萄城专门推出了 ComponentOne Enterprise 使用指南,该指南详细地介绍 ...
- ZOJ 2477 Magic Cube(魔方)
ZOJ 2477 Magic Cube(魔方) Time Limit: 2 Seconds Memory Limit: 65536 KB This is a very popular gam ...
- Oracle update语句更新值来自另一张表中的数据
task 任务表 role 角色表 两表之间必须有关联的字段 update task t set t.roleName = ( select r.name from role r where r.id ...