教程 其他 框架 组件 接口

swiper

概述

滑块视图容器

子组件

支持

属性

支持通用属性

名称类型默认值必填描述
index<number>当前显示的子组件索引
autoplay<boolean>false渲染完成后,是否自动进行播放
interval<number>3000ms自动播放时的时间间隔,单位毫秒
indicator<boolean>true是否启用 indicator,默认 true
loop 1010+<boolean>true是否开启循环模式,1030及以下版本子组件数量大于 2 时才生效
duration 1040+<number>-滑动动画时长(duration默认根据手指的速度动态计算)
vertical 1040+<boolean>false滑动方向是否为纵向,纵向时indicator 也为纵向
previousmargin 1040+<string>0px前边距,可用于露出前一项的一小部分,支持单位:px和%
nextmargin 1040+<string>0px后边距,可用于露出后一项的一小部分,支持单位:px和%

备注previousmarginnextmargin的总和不应该超过整个swiper大小的1/2,超过部分将会被截取。

样式

支持通用样式

名称类型默认值必填描述
indicator-color<color>rgba(0, 0, 0, 0.5)indicator 填充颜色
indicator-selected-color<color>#33b4ff 或者 rgb(51, 180, 255)indicator 选中时的颜色
indicator-size<length>20pxindicator 组件的直径大小
indicator-[top|left|right|bottom] 1040+``-indicator相对于swiper的位置

事件

支持通用事件

名称参数描述
change{index:currentIndex}当前显示的组件索引变化时触发

方法

名称参数描述
swipeTo{index: number(指定位置)}swiper 滚动到 index 位置

条匹配 "" 的结果

    没有搜索到与 "" 相关的内容