走马灯
在有限的空间内，循环播放同一类型的图片、文字等内容
基础用法
动态模糊 2.6.0
添加动态模糊可以为走马灯注入动感和流畅性。
指示器
指示器可以显示在走马灯外部
切换箭头
您可以定义何时显示箭头
自适应高度
当 carousel 的 height 设置为 auto 时，carousel 的高度将根据 carousel item 的高度自动设置
卡片模式
当页面足够宽但高度有限时，您可以为走马灯激活卡片模式
垂直布局
默认情况下，direction 是 horizontal。通过将 direction 设置为 vertical，使走马灯在垂直方向上显示。
Carousel API
Carousel 属性
| 名称 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| 高度 | 走马灯的高度 | string | '' |
| 初始索引 | 初始激活的幻灯片的索引（从 0 开始） | number | 0 |
| trigger | 指示器的触发方式 | 枚举 | 悬浮时 |
| 自动播放 | 是否自动循环播放幻灯片 | boolean | true |
| 间隔 | 自动循环的间隔，单位为毫秒 | number | 3000 |
| 指示器位置 | 指示器的位置 | 枚举 | '' |
| 箭头 | 箭头的显示时机 | 枚举 | 悬浮时 |
| type | 走马灯的类型 | 枚举 | '' |
| 卡片缩放 2.7.8 | 当类型为卡片时，次要卡片的缩放尺寸 | number | 0.83 |
| 循环 | 循环显示项目 | boolean | true |
| direction | 显示方向 | 枚举 | horizontal |
| 悬停时暂停 | 悬停时暂停自动播放 | boolean | true |
| 动态模糊 2.6.0 | 为走马灯注入动感和流畅性 | boolean | false |
Carousel 事件
| 名称 | 描述 | 类型 |
|---|---|---|
| change | 在活动幻灯片切换时触发，它有两个参数，一个是新活动幻灯片的索引，另一个是旧活动幻灯片的索引 | Function |
Carousel 插槽
| 名称 | 描述 | 子标签 |
|---|---|---|
| default | 自定义默认内容 | 走马灯项目 |
Carousel Exposes
| 方法 | 描述 | 类型 |
|---|---|---|
| 激活索引 2.7.8 | 激活的幻灯片索引 | number |
| 设置激活项 | 手动切换幻灯片，要切换到的幻灯片的索引，从 0 开始；或相应 el-carousel-item 的 name | Function |
| 上一个 | 切换到上一张幻灯片 | Function |
| 下一个 | 切换到下一张幻灯片 | Function |
Carousel-Item API
Carousel-Item 属性
| 名称 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| 名称 | 项目的名称，可在 setActiveItem 中使用 | string | '' |
| label | 相应指示器的文本内容 | string / number | '' |
Carousel-Item 插槽
| 名称 | 描述 |
|---|---|
| default | 自定义默认内容 |
来源
贡献者
