nuke-list-view

2.3.12 • Public • Published

Listview

  • category: UI
  • chinese: 列表
  • type: UI 组件

何时使用

用于展现一个数据列表,和 ScrollView 不同,ListView 使用 weex list 组件内存回收复用的能力,达到复用 cell 不卡顿的效果。

API

ListView

属性 说明 类型 默认值
renderHeader 头部 function
renderFooter 底部 function
renderRow 渲染单行的方法 function
dataSource 数据源 array
onEndReached 加载到底部时触发 的事件 原 onloadmore 事件
onEndReachedThreshold 加载更多的位移量 string 500
showScrollbar 是否显示滚动条 bool
resetLoadmore 实例方法,用于再次触发 loadmore [以下单独说明] function

resetLoadmore 实例方法

这是一个重置 onEndReached 是否能触发的 标记位的方法。

当 onEndReached 触发后,如果页面内容没有变长,或者反而变短了,下次再滑动到底部,onEndReached 不会被触发了。此时调用 resetLoadmore ,可以清除内置标记位,让 onEndReached 可以再次触发。

  // 调用 resetLoadmore 以保证上一次加载不到数据后,下次还能继续触发 onEndReached
  reset=(e)=>{
    this.refs.mylist.resetLoadmore();
  }
  render(){
    return (
      <ListView ref="mylist"
        renderHeader={this.renderHeader}
        renderFooter={this.renderFooter}
        renderRow={this.renderItem}
        dataSource={this.state.data}
      />
    )
  }

Readme

Keywords

Package Sidebar

Install

npm i nuke-list-view

Weekly Downloads

56

Version

2.3.12

License

Apache-2.0

Unpacked Size

65.3 kB

Total Files

13

Last publish

Collaborators

  • doub
  • fnatic
  • leanhunter