轮播图

分类

配置

示例

说明

内容

数据源

轮播图的数据源

交互

隐藏

控制轮播图的默认展示状态，为true 时将隐藏展示轮播图。

自动切换

在设定的时间间隔下自动在展示项之间进行切换，从而实现无需用户操作即可浏览所有展示项的效果。

自动切换的间隔

自动切换的间隔时间。

启用拖拽

可以拖拽切换展示项。

渐变切换动效

是否支持渐变切换动效。

动画效果

渐变切换的动画效果。支持匀速、缓入、缓出、缓入缓出。

切换动效的时间

渐变切换动画效果的持续时间。

样式

高度

详情参见通用属性

外边距

详情参见通用属性

显示箭头

是否展示切换箭头。

显示面板指示点

是否展示切换指示点。

面板指示点位置

指示点的位置。

图片填充

指定图片的内容应该如何适应到其使用高度和宽度确定的框。详情参见 object-fit 属性

• 覆盖：图片在保持其宽高比的同时填充元素的整个内容框

• 包含：图片将被缩放，以在填充元素的内容框时保持其宽高比。

• 拉伸：图片将完全填充组件框。如果图片的宽高比与组件框不相匹配，那么图片将被拉伸以适应组件框。

横向对齐

标题内容横向的对齐方式

纵向对齐

标题内容纵向的对齐方式

CSS 样式

背景颜色

轮播图每个展示项的背景颜色

标题文字颜色

标题内容的文字颜色

指示点宽度

指示点未激活状态下的宽度

激活态指示点宽度

指示点被激活状态下的宽度

指示点之间的间距

指示点之间的间距

指示点高度

指示点高度

指示点距离边缘的位置

指示点距离底部/顶部边缘的距离

名称

类型

示例

说明

dataSource

array

carousel1.dataSource

只读，轮播图组件的数据源

配置

说明

切换展示项时将要触发的事件