<list>
0.4 cn
Summary
A core component which provides the most popular features for using a list of items.
It can provide better experience and performance with smooth scrolling and memory reusing.
Child Components
Notes: The list's subcomponents can only contain cell, header, refresh, loading or fixed-position components. Other kind of components will not be displayed correctly.
celldefines the attributes and behavior of the cells that appear in list.header0.6.1 header which will stick to the top when it reaches the top of the screen.refreshcomponent can be used inside list to add pull down to refresh functionality.loadingcomponent can be used inside list to add pull up to loadmore functionality.refreshandloadingplease check out the refresh-loading.
Attributes
loadmoreoffset: <number> the offset distance downwards the bottom of the list to trigger the loadmore event, which is triggered when the list scrolls down near enough to the bottom.
Other attributes please check out the common attributes.
Styles
common styles: check out common styles for components
- support flexbox related styles
- support box model related styles
- support
positionrelated styles - support
opacity,background-coloretc.
Events
loadmore0.5: if the list scrolls to bottom, this event will be triggered immediately. You can load the next page of items in this event handler.
common events: check out the common events
- support
clickevent. Check out common events - support
appear/disappearevent. Check out common events
API
All cells or cell's subcomponents in list support the scrollToElement API in dom module
Restriction
Nested lists or scrollers within the same direction are not supported. In other words. nested lists/scroller must have different directions.
For example, a vertical list nested in a vertical list or scroller is not allowed. However, a vertical list nested in a horizontal list or scroller is legal.
Example
see list-basic demo