0.0.7 • Published 6 years ago
react-native-views v0.0.7
原生ListView
1.How to Install
npm install react-native-views --save
react-native link react-native-views添加资源文件
2. How to Use
Props
| Prop | Type | Note |
|---|---|---|
| data | Array | 数据源 |
| refreshState | RefreshState | -Idle 闲置状态 -HeaderRefreshing 下拉刷新中 -FooterRefreshing 加载更多中 -NoMoreData 没有更多 |
| renderItem | ListRenderItem | 返回每个item |
| reactModuleForCell | string | item的类名，用于优化ios列表性能 |
| onHeaderRefresh | func | 下拉刷新触发 |
| onFooterRefresh | func | 上拉加载出发 |
| ListHeaderComponent | Component | 头布局 |
Events
| Event Name | Param | Notes |
|---|---|---|
| scrollToIndex | number | 滑动到第几个条目 |
Note
1. 条目需要添加height属性
2. 需要注册Item：AppRegistry.registerComponent('ItemName', () => ItemName)
3. 如果Item用到TouchableOpacity嵌套TouchableOpacity,需要用 src/pages/RNListView/native-listview/button/button.tsxExample
<NativeListView
ref={v => this.listview = v}
data={this.state.data}
renderItem={this.renderItem.bind(this)}
refreshState={this.state.refreshState}
reactModuleForCell="ListViewItem"
onHeaderRefresh={this.onRefresh.bind(this)}
onFooterRefresh={this.onLoadMore.bind(this)}
ListHeaderComponent={<View
style={{height: 60, backgroundColor: 'pink'}}><Text>我是header</Text></View>}
/>