Skip to content
专业版
FaCarousel 轮播图
功能丰富的轮播图组件，支持自动播放、淡入淡出、自动滚动等效果。
使用场景
- 首页 Banner 轮播
- 产品展示轮播
- 图片画廊
- 客户评价轮播
- 新闻公告轮播
- 功能特性介绍
Props
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
opts | CarouselProps['opts'] | - | 轮播配置选项 |
orientation | 'horizontal' | 'vertical' | 'horizontal' | 滚动方向 |
autoplay | AutoplayOptionsType | - | 自动播放配置 |
autoScroll | AutoScrollOptionsType | - | 自动滚动配置 |
fade | boolean | false | 是否启用淡入淡出效果 |
class | HTMLAttributes['class'] | - | 容器 CSS 类 |
contentClass | HTMLAttributes['class'] | - | 内容区 CSS 类 |
itemClass | HTMLAttributes['class'] | - | 单个项目 CSS 类 |
Slots
| 名称 | 说明 |
|---|---|
default | 轮播内容（幻灯片列表） |
注意事项
- 内容结构：
defaultslot 应该直接包含轮播项目，不要用其他元素包裹 - 自动播放：设置
autoplay后会自动轮播，用户交互后会暂停 - 切换按钮：组件内置左右切换按钮
- 响应式：轮播图会自动适应容器宽度
- 循环模式：默认支持循环滚动