屬性名	類(lèi)型	默認(rèn)值	說(shuō)明
min	Number	0	最小值
max	Number	100	最大值
step	Number	1	步長(zhǎng)，取值必須大于 0，并且可被 (max - min) 整除
disabled	Boolean	false	是否禁用
value	Number	0	當(dāng)前取值
show-value	Boolean	false	是否顯示當(dāng)前value
bindchange	EventHandle		完成一次拖動(dòng)后觸發(fā)的事件，event.detail = {value:value}

示例代碼：

<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)

感謝閱讀，希望能幫助到大家，謝謝大家對(duì)本站的支持！

您可能感興趣的文章:

相關(guān)文章

詳解如何使用mock.js實(shí)現(xiàn)接口測(cè)試的自動(dòng)化
這篇文章主要為大家介紹了如何使用mock.js實(shí)現(xiàn)接口測(cè)試的自動(dòng)化詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2023-06-06
JS?class語(yǔ)法糖的深入剖析
這篇文章主要為大家介紹了JS?class語(yǔ)法糖的深入剖析，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2022-07-07
微信小程序中wx.chooseAddress(OBJECT)實(shí)例詳解
這篇文章主要介紹了微信小程序中wx.chooseAddress(OBJECT)實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下
2017-03-03
JS時(shí)間分片技術(shù)解決長(zhǎng)任務(wù)導(dǎo)致的頁(yè)面卡頓
旨在把一個(gè)運(yùn)行時(shí)間比較長(zhǎng)的任務(wù)分解成一塊一塊比較小的任務(wù)，分塊去執(zhí)行，因?yàn)槌^(guò) 50ms 的任務(wù)就會(huì)被認(rèn)為是 long task，用戶(hù)就能感知到渲染卡頓和交互的卡頓，所以我們可以縮短函數(shù)的連續(xù)執(zhí)行時(shí)間
2022-07-07
Flutter刷新組件RefreshIndicator自定義樣式demo
這篇文章主要介紹了Flutter刷新組件RefreshIndicator自定義樣式demo,有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
2023-02-02
JavaScript高級(jí)程序設(shè)計(jì)之變量與作用域
這篇文章主要介紹了JavaScript高級(jí)程序設(shè)計(jì)之變量與作用域，文章主要通過(guò)描述原始值與引用值、instanceof、作用域展開(kāi)具體內(nèi)容,需要的朋友可以參考一下
2021-11-11
詳解微信小程序Radio選中樣式切換
這篇文章主要介紹了詳解微信小程序Radio選中樣式切換的相關(guān)資料,需要的朋友可以參考下
2017-07-07
微信小程序（一）新建項(xiàng)目hello WeApp 詳細(xì)介紹
這篇文章主要介紹了微信小程序（一）hello WeApp 詳細(xì)介紹的相關(guān)資料,需要的朋友可以參考下
2016-09-09
微信小程序藍(lán)牙的實(shí)現(xiàn)實(shí)例代碼
這篇文章主要介紹了微信小程序藍(lán)牙的實(shí)現(xiàn)實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下
2017-06-06
8個(gè)JS的reduce使用實(shí)例和reduce操作方式
reduce方法是JavaScript中一個(gè)比較強(qiáng)大的方法，可能在平時(shí)開(kāi)發(fā)中，有人根本沒(méi)用過(guò)，通過(guò)下面的8個(gè)例子，學(xué)會(huì)reduce的用法以及它的常用場(chǎng)景,需要的朋友可以參考一下
2021-09-09