快應(yīng)用 swiper組件

2020-08-06 13:47 更新

概述

滑塊視圖容器

子組件

支持

屬性

支持 通用屬性

名稱 類(lèi)型 默認(rèn)值 必填 描述
index <number> ０ 否 當(dāng)前顯示的子組件索引
autoplay <boolean> false 否 渲染完成后，是否自動(dòng)進(jìn)行播放
interval <number> 3000ms 否 自動(dòng)播放時(shí)的時(shí)間間隔，單位毫秒
indicator <boolean> true 否 是否啟用 indicator，默認(rèn) true
loop 1010+ <boolean> true 否 是否開(kāi)啟循環(huán)模式，1030及以下版本子組件數(shù)量大于 2 時(shí)才生效
duration 1040+ <number> - 否 滑動(dòng)動(dòng)畫(huà)時(shí)長(zhǎng)(duration默認(rèn)根據(jù)手指的速度動(dòng)態(tài)計(jì)算)
vertical 1040+ <boolean> false 否 滑動(dòng)方向是否為縱向,縱向時(shí)indicator 也為縱向
previousmargin 1040+ <string> 0px 否 前邊距，可用于露出前一項(xiàng)的一小部分，支持單位：px和%
nextmargin 1040+ <string> 0px 否 后邊距，可用于露出后一項(xiàng)的一小部分，支持單位：px和%

備注：previousmargin和nextmargin的總和不應(yīng)該超過(guò)整個(gè)swiper大小的1/2，超過(guò)部分將會(huì)被截取。

樣式

支持 通用樣式

名稱 類(lèi)型 默認(rèn)值 必填 描述
indicator-color <color> rgba(0, 0, 0, 0.5) 否 indicator填充顏色
indicator-selected-color <color> #33b4ff 或者 rgb(51, 180, 255) 否 indicator選中時(shí)的顏色
indicator-size <length> 20px 否 indicator組件的直徑大小
indicator-[top|left|right|bottom] <length>
<percentage> 		- 否 indicator相對(duì)于swiper的位置

事件

支持 通用事件

名稱 參數(shù) 描述
change {index:currentIndex} 當(dāng)前顯示的組件索引變化時(shí)觸發(fā)

方法

名稱 參數(shù) 描述
swipeTo {index: number(指定位置)} swiper滾動(dòng)到index位置

swiper   示例代碼

查看 示例代碼


以上內(nèi)容是否對(duì)您有幫助：
在線筆記
App下載
App下載

掃描二維碼

下載編程獅App

公眾號(hào)
微信公眾號(hào)

編程獅公眾號(hào)