列表

分类

配置

示例

说明

内容

数据源

列表的数据源。

主键

主键是用于唯一标识每一条数据的字段，确保数据的完整性和准确性。

交互

隐藏

控制列表组件的默认展示状态，为true 时将隐藏组件。详情参见通用属性

可选中

数据是否支持选中，展示选中状态。

默认选中

「可选中」配置项开启时生效，值为数据的主键值。

分页设置

列表的分页配置，开启后支持翻页。

加载

列表的加载状态

样式

高度

详情参见通用属性

外边距

详情参见通用属性

内边距

详情参见通用属性

列表形式

列表的展示形式。

分割线

列表模式下生效，数据是否以分割线间隔。

列数

「列表形式」为网格时生效，一行展示的数据个数。

栅格间距

「列表形式」为网格时生效，数据之间的间距。

空状态文案

列表数据源为空时的展示文案

CSS 样式

溢出

设置数据溢出列表所需的行为，对应 CSS 属性：overflow，详情参见 mdn 详细说明

背景色

设置背景颜色，对应 CSS 属性：background-color，查看 mdn 详细说明

背景

设置各种背景属性，包括 color, image, origin 与 size, repeat 方式等，对应 CSS 属性：background，查看 mdn 详细说明

背景图片

设置一个或者多个背景图像，对应 CSS 属性：background-image，查看 mdn 详细说明

阴影

设置阴影效果，对应 CSS 属性：box-shadow，查看 mdn 详细说明

上边框

设置上边框属性，对应 CSS 属性：border-top, 查看 mdn 详细说明

下边框

设置下边框属性，对应 CSS 属性：border-bottom, 查看 mdn 详细说明

左边框

设置左边框属性，对应 CSS 属性：border-left, 查看 mdn 详细说明

右边框

设置右边框属性，对应 CSS 属性：border-right, 查看 mdn 详细说明

圆角

列表组件的圆角，对应 CSS 属性：border-radius，查看 mdn 详细说明

边框

列表组件的边框，对应 CSS 属性：border, 查看 mdn 详细说明

选中态背景色

「可选中」为true时生效，列表数据项被选中时的背景颜色

选中态Hover背景色

可选中」为true时生效，鼠标悬浮在列表数据项时的背景颜色

名称

类型

示例

说明

dataSource

array

list1.dataSource

当前列表组件的数据源

loading

boolean

list1.loading

当前列表组件的加载状态

selectedKey

string

list1.selectedKey

当前选中数据项的主键值

pagination

object

list1.pagination

只读，当前列表组件的分页信息

setDataSource

func

list1.setDataSource(xxxx)

设置列表组件的数据为xxxx

clearDataSource

func

list1.clearDataSource()

清除列表组件的数据

setLoading

func

list1.setLoading(true)

设置列表组件的加载状态,参数值为true或者false

clearLoading

func

list1.clearLoading()

清除列表组件的加载状态

setSelectedKey

func

list1.setSelectedKey('option1')

设置列表组件的选中数据项的主键值为option1

clearSelectedKey

func

list1.clearSelectedKey()

清除列表组件的选中数据项的主键值

配置

说明

当点击单元项时将触发的事件