W3Cschool
恭喜您成為首批注冊(cè)用戶
獲得88經(jīng)驗(yàn)值獎(jiǎng)勵(lì)
滑動(dòng)選擇器。
屬性名 | 類型 | 默認(rèn)值 | 說明 | 最低版本 |
---|---|---|---|---|
min | Number | 0 | 最小值 | |
max | Number | 100 | 最大值 | |
step | Number | 1 | 步長(zhǎng),取值必須大于 0,并且可被(max - min)整除 | |
disabled | Boolean | false | 是否禁用 | |
value | Number | 0 | 當(dāng)前取值 | |
color | Color | #e9e9e9 | 背景條的顏色(請(qǐng)使用 backgroundColor) | |
selected-color | Color | #1aad19 | 已選擇的顏色(請(qǐng)使用 activeColor) | |
activeColor | Color | #1aad19 | 已選擇的顏色 | |
backgroundColor | Color | #e9e9e9 | 背景條的顏色 | |
show-value | Boolean | false | 是否顯示當(dāng)前 value | |
bindchange | EventHandle | 完成一次拖動(dòng)后觸發(fā)的事件,event.detail = {value: value} | ||
bindchanging | EventHandle | 拖動(dòng)過程中觸發(fā)的事件,event.detail = {value: value} | 1.7.0 |
示例代碼:
<view class="section section_gap">
<text class="section__title">設(shè)置left/right icon</text>
<view class="body-view">
<slider bindchange="slider1change" left-icon="cancel" right-icon="success_no_circle"/>
</view>
</view>
<view class="section section_gap">
<text class="section__title">設(shè)置step</text>
<view class="body-view">
<slider bindchange="slider2change" step="5"/>
</view>
</view>
<view class="section section_gap">
<text class="section__title">顯示當(dāng)前value</text>
<view class="body-view">
<slider bindchange="slider3change" show-value/>
</view>
</view>
<view class="section section_gap">
<text class="section__title">設(shè)置最小/最大值</text>
<view class="body-view">
<slider bindchange="slider4change" min="50" max="200" show-value/>
</view>
</view>
var pageData = {}
for(var i = 1; i < 5; ++i) {
(function (index) {
pageData['slider' + index + 'change'] = function(e) {
console.log('slider' + 'index' + '發(fā)生 change 事件,攜帶值為', e.detail.value)
}
})(i);
}
Page(pageData)
Copyright©2021 w3cschool編程獅|閩ICP備15016281號(hào)-3|閩公網(wǎng)安備35020302033924號(hào)
違法和不良信息舉報(bào)電話:173-0602-2364|舉報(bào)郵箱:jubao@eeedong.com
掃描二維碼
下載編程獅App
編程獅公眾號(hào)
聯(lián)系方式:
更多建議: