手册版本 V3.0
GraceUI 新轮播组件更新于 2019-10-07,通过灵活的配置可以实现多种模式的轮播组件;注 : weex 版本因底层支持不足无法实现缩放功能,当不影响组件使用;
graceSwiperCard 组件属性
属性名称 | 类型 | 默认值 | 作用 |
width | String | 100% | 组件宽度 |
height | String | 300rpx | 组件高度 |
swiperItems | Array | [] | 数组形式的轮播项目 |
borderRadius | String | 5rpx | 轮播图标圆角尺寸 |
indicatorDots | Boolean | true | 是否展示进度圆点 |
indicatorColor | String | rgba(0, 0, 0, 0.2) | 进度圆点颜色 |
indicatorActiveColor | String | #3688FF | 激活圆点颜色 |
spacing | String | 50rpx | 轮播项目间距 |
interval | Number
| 5000 | 轮播动画间隔时间,单位毫秒 |
padding | String | 0 10rpx | 轮播项目内间距 |
scale | Boolean | true | 非当前项目是否缩放 |
autoplay | Boolean | true | 是否自动播放 |
currentIndex | Number | 0 | 默认选项的索引值 |
触发的事件
@swiperchange 轮播项目切换事件,携带参数 : 当前项目的 index
swiperItems 数组格式
swiperItems : [
{
img : '图片地址',
url : '点击图片打开的页面地址',
opentype : '窗口打开方式'
},
......
]
演示代码
UNI 普通版本
NVUE 版本
微信小程序独立版本
登录并购买 GraceUI 后可以查阅完整手册内容 。
登录并购买 GraceUI 后可以查阅完整手册内容 。
登录并购买 GraceUI 后可以查阅完整手册内容 。