List 列表

列表用于以行或网格的形式展示同类信息。Rue 的 List 使用 daisyUI 的轻量视觉，并补充 dataSource、renderItem、Meta、actions、extra、分页、加载和空态等能力。

# List（第二列默认填充剩余空间）

展示基础组合式写法，适合快速拼装一组紧凑行。

使用 List.ColGrow 显式控制哪一列占据剩余宽度。

整合基础示例的手动 map 方式，适合完全掌控每一行结构。

items 仍然可用，适合用纯数据配置直接生成 Meta 与侧边信息。

List.ColWrap 用于长文本、说明或次级信息换行展示。

Most played songs this week
Dio Lupa
Remaining Reason
Remaining Reason became an instant hit, praised for its haunting sound and emotional depth.
Ellie Beilish
Bears of a fever
Bears of a Fever pairs restless percussion with a chorus built for repeat plays.
Sabrino Gardener
Cappuccino
Cappuccino keeps the melody smooth while the hook does the heavy lifting.

数据源驱动的列表 API 适合业务列表统一从数据源渲染。

List.Item.Meta 管标题、描述和头像，actions/extra 放操作与侧边内容。

pagination 内置简单分页；loadMore 可放在列表底部承载自定义加载动作。

1-2 of 5

grid 提供 column/gutter，用于把同类条目排成卡片网格。

空数据和加载中状态直接由 List 承接，便于异步列表先搭好骨架。

属性	说明	类型	默认值
`children`	直接传入自定义 li、List.Row、List.Item 等内容	`any`	`-`
`items`	支持基础 Rue 数据结构，支持 item、row、cols	`ListDataItem[]`	`-`
`dataSource`	数据源驱动的数组入口，通常搭配 renderItem	`any[]`	`-`
`renderItem`	自定义 dataSource 中每一项的渲染内容	`(item, index) => any`	`-`
`rowKey`	列表项 key，可传字段名或函数	`string \| (item, index) => string \| number`	`key`
`header / footer`	列表头部和底部内容	`any`	`-`
`loading`	加载态，支持 boolean 或 { spinning, tip, indicator }	`boolean \| object`	`false`
`pagination`	分页配置，支持 current、pageSize、position、align、showTotal	`boolean \| ListPaginationConfig \| false`	`false`
`grid`	网格列表配置，支持 column 与 gutter	`{ column?: number; gutter?: number \| string }`	`-`
`itemLayout`	列表项布局语义，vertical 会让 extra/actions 更适合图文内容	`'horizontal' \| 'vertical'`	`'horizontal'`
`bordered / split / size`	边框、分割与尺寸控制	`boolean / boolean / ListSize`	`false / true / default`
`List.Item`	支持 actions、extra、classNames、styles，并包含 List.Item.Meta	`compound component`	`-`