概括
這是一個(gè)提供了常見(jiàn)的列表功能的核心組件,通過(guò)平滑滾動(dòng)和內(nèi)存回收提供了更好的用戶體驗(yàn)和性能
子組件
注意: list的子組件只能包括 cell, header, refresh, loading 或者是 fix定位的組件. 其他形式的組件將不能被正確的渲染
- cell 定義了展現(xiàn)在list中的元件的屬性和行為
- header 0.6.1 當(dāng) header到達(dá)屏幕頂部時(shí),將會(huì)固定在屏幕頂部 .
- refresh 組件可以用來(lái)給列表添加下拉刷新的功能
- loading 組件可以用來(lái)給列表添加上拉加載更多的功能
- refresh and loading 請(qǐng)查看 refresh-loading.
屬性
loadmoreoffset: <number> 觸發(fā)loadmore事件所需要的滾動(dòng)條距離list底部的垂直偏移距離.當(dāng)list的滾動(dòng)條滾動(dòng)到足夠接近list底部時(shí)將會(huì)觸發(fā)load more這個(gè)事件
樣式
公共樣式
- 支持flexbox 等樣式
- 支持box model 等樣式
- 支持position 等樣式
- 支持opacity, background-color 等
事件
loadmore: 如果列表滾動(dòng)到底部將會(huì)立即觸發(fā)這個(gè)事件,你可以在這個(gè)事件的處理函數(shù)中加載下一頁(yè)的列表項(xiàng).
公共事件
支持click 事件
支持 appear / disappear 事件
scrollToElement(node, options)
讓頁(yè)面滾動(dòng)到那個(gè)對(duì)應(yīng)的節(jié)點(diǎn),這個(gè)API只能在scroller和list組件中用。
要在你的.we文件中使用這個(gè)API,可以使用require('@weex-module/dom').scrollToElement。
- node(Node): 你要滾動(dòng)到的那個(gè)節(jié)點(diǎn)
- options(object): 如下選項(xiàng)
offset(number): 一個(gè)到其可見(jiàn)位置的偏移距離,默認(rèn)是0
var dom = require('@weex-module/dom');
dom.scrollToElement(this.$el('someId'), {offset: 10});
約束
不允許相同方向的list或者scroller互相嵌套.換句話說(shuō)就是嵌套的lists/scroller必須是不同的方向
舉個(gè)例子,不允許一個(gè)垂直方向的list嵌套的一個(gè)垂直方向的scroller中,但是一個(gè)垂直方向的list是可以嵌套的一個(gè)水平方向的list或者scroller中的.