List组件的用法

75 阅读2分钟

定义

列表包含一系列相同宽度的列表项。适合连续、多行呈现同类数据,例如图片和文本。

子组件

仅支持ListItemListItemGroup子组件。

接口

List(value?:{space?: number | string, initialIndex?: number, scroller?: Scroller}) 参数:

参数名参数类型必填参数描述
spacenumber|string子组件主轴方向的间隔。默认值:0参数类型为number时单位为vp**说明:**设置为负数或者大于等于List内容区长度时,按默认值显示。space参数值小于List分割线宽度时,子组件主轴方向的间隔取分割线宽度。
initialIndexnumber设置当前List初次加载时视口起始位置显示的item的索引值。默认值:0**说明:**设置为负数或超过了当前List最后一个item的索引值时视为无效取值,无效取值按默认值显示。
scrollerScroller可滚动组件的控制器。用于与可滚动组件进行绑定。**说明:**不允许和其他滚动类组件绑定同一个滚动控制对象。

属性

除支持通用属性外,还支持以下属性:

listDirection

listDirection(value: Axis)

设置List组件排列方向。

参数:

参数名类型必填说明
valueAxis组件的排列方向。默认值:Axis.Vertical

divider

divider(value: {strokeWidth: Length; color?: ResourceColor; startMargin?: Length; endMargin?: Length;} | null,)

设置ListItem分割线样式,默认无分割线。

ListItem设置多态样式时,被按压的子组件上下的分割线不绘制。

参数:

参数名类型必填说明
value{strokeWidth: Length,color?:ResourceColor,startMargin?: Length,endMargin?: Length}nullListItem分割线样式。- strokeWidth: 分割线的线宽。- color: 分割线的颜色。- startMargin: 分割线与列表侧边起始端的距离。- endMargin: 分割线与列表侧边结束端的距离。