简介
轮播图组件是一种动态展示多个图像或内容的用户界面元素,通常以自动播放或用户控制的方式在不同内容之间切换。
配置项
分类 | 配置 | 示例 | 说明 |
分类 | 配置 | 示例 | 说明 |
内容 | 数据源 | 轮播图的数据源 | |
交互 | 隐藏 | 控制轮播图的默认展示状态,为 | |
自动切换 | 在设定的时间间隔下自动在展示项之间进行切换,从而实现无需用户操作即可浏览所有展示项的效果。 | ||
自动切换的间隔 | 自动切换的间隔时间。 | ||
启用拖拽 | 可以拖拽切换展示项。 | ||
渐变切换动效 | 是否支持渐变切换动效。 | ||
动画效果 | 渐变切换的动画效果。支持匀速、缓入、缓出、缓入缓出。 | ||
切换动效的时间 | 渐变切换动画效果的持续时间。 | ||
样式 | 高度 | 详情参见通用属性 | |
外边距 | 详情参见通用属性 | ||
显示箭头 | 是否展示切换箭头。 | ||
显示面板指示点 | 是否展示切换指示点。 | ||
面板指示点位置 | 指示点的位置。 | ||
图片填充 | 指定图片的内容应该如何适应到其使用高度和宽度确定的框。详情参见 object-fit 属性
| ||
横向对齐 | 标题内容横向的对齐方式 | ||
纵向对齐 | 标题内容纵向的对齐方式 | ||
CSS 样式 | 背景颜色 | 轮播图每个展示项的背景颜色 | |
标题文字颜色 | 标题内容的文字颜色 | ||
指示点宽度 | 指示点未激活状态下的宽度 | ||
激活态指示点宽度 | 指示点被激活状态下的宽度 | ||
指示点之间的间距 | 指示点之间的间距 | ||
指示点高度 | 指示点高度 | ||
指示点距离边缘的位置 | 指示点距离底部/顶部边缘的距离 |
属性与方法
名称 | 类型 | 示例 | 说明 |
名称 | 类型 | 示例 | 说明 |
dataSource | array |
| 只读,轮播图组件的数据源 |
事件回调
配置 | 说明 |
配置 | 说明 |
切换展示项时将要触发的事件 |
该文章对您有帮助吗?
- 本页导读
- 简介
- 配置项
- 属性与方法
- 事件回调