UNPKG

weex-nuke

Version:

基于 Rax 、Weex 的高性能组件体系 ~~

62 lines (42 loc) 2.76 kB
# Listview - category: UI - chinese: 列表 - type: UI Component --- ## Usage Be used to show a datalist, which is different with `ScrollView`, `ListView` uses the weex list component memory reuse capability, in order to reuse cell smoothly. ## API ### ListView | Attribute | Description | Type | Default | | --------------------- | ----------------------------------------------------- | ---------------- | ------- | | renderHeader | header | function | null | | renderFooter | footer | function | null | | renderRow | render single row | function | null | | dataSource | data source | array | null | | onEndReached | The event that was triggered when the unit was loaded | onloadmore event | null | | onEndReachedThreshold | load more displacement | string | 500 | | showScrollbar | show the scroll bar | bool | null | | resetLoadmore | reset the loadmore count(explanation following) | function | null | ### resetLoadmore demo reference This is a method that reset the flag of `onEndReached can be triggered?`. The flag's default value is true, that is, which scrolls to the bottom to trigger the onEndReached event. However, **the native app will set the flag to false, if the target has triggered the onEndReached event but the content of page scroller becomes more ( or less instead ) without loading more data through the setState.** Call the resetLoadmore to reset the flag so that the onEndReachen event could be triggered again. ``` //Call the resetLoadmore to reset the flag so that the onEndReachen event could be triggered again. reset=(e)=>{ this.refs.mylist.resetLoadmore(); } render(){ return ( <ListView ref="mylist" renderHeader={this.renderHeader} renderFooter={this.renderFooter} renderRow={this.renderItem} dataSource={this.state.data} ><ListView/> ) } ``` ## The Other - Chat with <a href="dingtalk://dingtalkclient/action/sendmsg?dingtalk_id=kjwo3w5">@翊晨[yichen]</a> in Dingtalk desktop App <a href='https://tms.dingtalk.com/markets/dingtalk/download'>Download</a> - DingTalk Group <img src="https://img.alicdn.com/tfs/TB101EESpXXXXXFXpXXXXXXXXXX-1122-1362.jpg" width="260" />