react-native试玩(8)-列表视图

发布时间：2020-12-15 05:23:16 所属栏目：百科来源：网络整理

导读：ListView 属性名称类型意义默认值 dataSource ListViewDataSource 数据集无 initialListSize number 设置第一页初始化的元素个数无 onChangeVisibleRows function 当有元素的可见性发生改变的时候，该函数会被调用，(visibleRows,changedRows)参数代表

ListView

属性

名称	类型	意义	默认值
dataSource	ListViewDataSource	数据集	无
initialListSize	number	设置第一页初始化的元素个数	无
onChangeVisibleRows	function	当有元素的可见性发生改变的时候，该函数会被调用，(visibleRows,changedRows)参数代表了状态可见，状态改变的行，当visible为true时，代表滑入到视图，当visible为false表示滑出视图	无
onEndReached	function	当搜有元素展现完成护着滑动结束后调用的函数	无
onEndReachedThreshold	number	像素的临界值，该属性和onEndReached配合使用，因为onEndReached滑动结束的标志是以该值作为判断条件的	无
pageSize	number	每一次循环事件显示的行数(暂没理解该意思)	无
removeClippedSubviews	bool	提升性能的一个选项，是一解决溢出的方法，具体做法是隐藏行容器	无
renderFooter	function	渲染底部	无
renderHeader	function	渲染头部	无
renderRow	function	渲染行	无
renderScrollComponent	function	返回一个可滚动的组件	无
renderSectionHeader	function	不祥	无
renderSeparator	function	针对某一特殊元素进行渲染	无
scrollRenderAheadDistance	number	渲染的时间	无

实例

'use strict';

var React = require('react-native');

var {
    ListView,AppRegistry,StyleSheet,View,Text,} = React;

var helloworld = React.createClass({
    getInitialState: function() {
    var ds = new ListView.DataSource({rowHasChanged: (r1,r2) => r1 !== r2}); return { dataSource: ds.cloneWithRows(['row 1','row 2','row 3','row 4','row 5','row 6','row 7','row 8','row 9']),}; },render: function() { return ( <ListView dataSource={this.state.dataSource} renderRow={(rowData) => <Text>{rowData}</Text>} initialListSize={5} pageSize={1} scrollRenderAheadDistance={20} /> ); },}); var styles = StyleSheet.create({ }); AppRegistry.registerComponent('hellowrold',() => helloworld);

Android

适用于Android

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!