产品动态
产品公告
ListView 列表
组件功能
列表视图容器组件（ListView） 用于承载并展示多个列表项（ListViewItem），是构建纵向信息列表的基础容器。
该组件负责统一管理列表结构、展示数量及整体状态信息，具体的内容与交互由内部的列表项组件定义。
基础用法
通过 children 属性配置多个 ListViewItem，即可快速构建标准列表视图。
Template 示例：
<ListView><ListViewItem gap="16px" align="center"><Icon name="profile" size="lg" /><Text value="用户资料" /><Button label="查看" size="sm" /></ListViewItem></ListView>
效果展示如下：
属性说明
属性名 | 类型 | 描述 | 默认值 |
children ★ | ListViewItem[] | 列表项数组 | - |
limit | number | "auto" | 显示数量限制 | - |
status | WidgetStatus | 状态配置 | - |
注意：
★ 标记为必填属性。
WidgetStatus 类型说明
status 用于在列表区域展示辅助状态信息，当前支持以下两种配置形式：
1. 字符串： 直接显示状态文本，适用于简单提示。
Template 示例：
<ListView status="共 10 条记录"><ListViewItem gap="16px" align="center"><Icon name="profile" size="lg" /><Text value="用户资料" /><Button label="查看" size="sm" /></ListViewItem></ListView>
效果展示如下：
2. 对象：通过包含 text 字段的对象配置状态内容。
Template 示例：
<ListView status={{ text: "共 10 条记录" }}><ListViewItem gap="16px" align="center"><Icon name="profile" size="lg" /><Text value="用户资料" /><Button label="查看" size="sm" /></ListViewItem></ListView>
效果展示如下：
注意：
虽然类型定义中包含
icon 和 favicon 字段，但当前实现仅显示文本内容，不支持图标显示。ListViewItem 子组件
使用示例
以下示例展示了一个带展示数量限制和状态提示的列表视图。
Template 示例：
<ListView limit={5} status="显示前 5 条记录"><ListViewItemgap="12px"align="center"onClickAction={{ type: "select_item", payload: { id: "1" } }}><Icon name="document" color="#0052D9" /><Text value="文档 1" /></ListViewItem><ListViewItem gap="12px" align="center"><Icon name="document" color="#0052D9" /><Text value="文档 2" /></ListViewItem></ListView>
效果展示如下：
文档反馈