跳到主要内容
版本:v8

ion-list

列表由多行 项目 组成,可包含文本、按钮、切换开关、图标、缩略图等。列表通常包含具有相似数据内容的项目,例如图片和文本。

列表支持多种交互方式,包括滑动项目以显示操作选项、拖动以在列表中重新排序项目以及删除项目。

基本用法

内嵌列表

对列表添加 inset 属性将为列表应用外边距。在 ios 模式下,还会为列表添加圆角。

列表边框线

对列表添加 lines 属性将调整列表中所有项目的底部边框。设置为 "full" 将显示全宽边框,"inset" 将显示带左内边距的边框,"none" 将不显示边框。如果列表中的某个项目上设置了 lines 属性,则该项目的设置将优先于列表上的设置。

属性

inset

说明If true, the list will have margin around it and rounded corners.
属性inset
类型boolean
默认值false

lines

说明How the bottom border should be displayed on all items.
属性lines
类型"full" | "inset" | "none" | undefined
默认值undefined

mode

说明The mode determines which platform styles to use.

这是一个虚拟属性,在初始化时设置一次,之后更改其值不会更新组件。
属性mode
类型"ios" | "md"
默认值undefined

事件

该组件没有可用的事件。

方法

closeSlidingItems

说明If ion-item-sliding are used inside the list, this method closes any open sliding item.

Returns true if an actual ion-item-sliding is closed.
签名closeSlidingItems() => Promise<boolean>

CSS Shadow Parts

该组件没有可用的 CSS 阴影部分。

CSS 自定义属性

该组件没有可用的 CSS 自定义属性。

插槽

该组件没有可用的插槽。