小編給大家分享一下微信開發之slider的示例分析,相信大部分人都還不怎么了解,因此分享這篇文章給大家參考一下,希望大家閱讀完這篇文章后大有收獲,下面讓我們一起去了解一下吧!
成都創新互聯公司服務項目包括婁星網站建設、婁星網站制作、婁星網頁制作以及婁星網絡營銷策劃等。多年來,我們專注于互聯網行業,利用自身積累的技術優勢、行業經驗、深度合作伙伴關系等,向廣大中小型企業、政府機構等提供互聯網行業的解決方案,婁星網站推廣取得了明顯的社會效益與經濟效益。目前,我們服務的客戶以成都為中心已經輻射到婁星省份的部分城市,未來相信會繼續擴大服務區域并繼續獲得客戶的支持與信任!實現效果圖:
滑動選擇器
屬性名 | 類型 | 默認值 | 說明 |
---|---|---|---|
min | Number | 0 | 最小值 |
max | Number | 100 | 較大值 |
step | Number | 1 | 步長,取值必須大于 0,并且可被 (max - min) 整除 |
disabled | Boolean | false | 是否禁用 |
value | Number | 0 | 當前取值 |
show-value | Boolean | false | 是否顯示當前value |
bindchange | EventHandle | 完成一次拖動后觸發的事件,event.detail = {value:value} |
示例代碼:
<view class="section section_gap"> <text class="sectiontitle">設置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="sectiontitle">設置step</text> <view class="body-view"> <slider bindchange="slider2change" step="5"/> </view> </view> <view class="section section_gap"> <text class="sectiontitle">顯示當前value</text> <view class="body-view"> <slider bindchange="slider3change" show-value/> </view> </view> <view class="section section_gap"> <text class="sectiontitle">設置最小/較大值</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}發生change事件,攜帶值為`, e.detail.value) } })(i); } Page(pageData)
以上是“微信開發之slider的示例分析”這篇文章的所有內容,感謝各位的閱讀!相信大家都有了一定的了解,希望分享的內容對大家有所幫助,如果還想學習更多知識,歡迎關注創新互聯行業資訊頻道!
網站名稱:微信開發之slider的示例分析-創新互聯
文章源于:http://vcdvsql.cn/article8/ceeoip.html
成都網站建設公司_創新互聯,為您提供標簽優化、商城網站、響應式網站、外貿網站建設、網站營銷、云服務器
聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯