跳到主要内容
版本:v8

ion-item-divider

shadow

Item dividers 是可用于分隔列表中 items 的块元素。它们类似于列表标题,但应放在项目组之间,而不是仅放在列表顶部。

基本用法

主题

颜色

CSS 自定义属性

属性

color

说明The color to use from your application's color palette. Default options are: "primary", "secondary", "tertiary", "success", "warning", "danger", "light", "medium", and "dark". For more information on colors, see theming.
属性color
类型"danger" | "dark" | "light" | "medium" | "primary" | "secondary" | "success" | "tertiary" | "warning" | string | undefined
默认值undefined

mode

说明The mode determines which platform styles to use.

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

sticky

说明When it's set to true, the item-divider will stay visible when it reaches the top of the viewport until the next ion-item-divider replaces it.

This feature relies in position:sticky: https://caniuse.com/#feat=css-sticky
属性sticky
类型boolean
默认值false

事件

该组件没有可用的事件。

方法

该组件没有可用的公共方法。

CSS Shadow Parts

Name说明
containerThe wrapper element that contains the default slot.
innerThe inner wrapper element that arranges the divider content.

CSS 自定义属性

Name说明
--backgroundBackground of the item divider
--colorColor of the item divider
--inner-padding-bottomBottom inner padding of the item divider
--inner-padding-endEnd inner padding of the item divider
--inner-padding-startStart inner padding of the item divider
--inner-padding-topTop inner padding of the item divider
--padding-bottomBottom padding of the item divider
--padding-endRight padding if direction is left-to-right, and left padding if direction is right-to-left of the item divider
--padding-startLeft padding if direction is left-to-right, and right padding if direction is right-to-left of the item divider
--padding-topTop padding of the item divider

插槽

Name说明
Content is placed between the named slots if provided without a slot.
endContent is placed to the right of the divider text in LTR, and to the left in RTL.
startContent is placed to the left of the divider text in LTR, and to the right in RTL.