微信小程序使用slider設(shè)置數(shù)據(jù)值及switch開關(guān)組件功能【附源碼下載】
更新時間：2017年12月09日 11:15:06 作者：FutrueJet
這篇文章主要介紹了微信小程序使用slider設(shè)置數(shù)據(jù)值及switch開關(guān)組件功能,結(jié)合實例形式分析了slider組件及switch組件的功能與使用方法,并附帶源碼供讀者下載參考,需要的朋友可以參考下
本文實例講述了微信小程序使用slider設(shè)置數(shù)據(jù)值及switch開關(guān)組件功能。分享給大家供大家參考，具體如下：
1、效果展示
2、關(guān)鍵代碼
① index.wxml
<view>微信小程序組件：滑動選擇器slider</view>
<slider bindchange="sliderBindchange" min="{{min}}" max="{{max}}" show-value/>
<view>最小值：{{min}}</view>
<view>最大值：{{max}}</view>
<view>當前值：{{text}}</view>
<view>---------------------------------</view>
<view>微信小程序組件：開關(guān)組件switch</view>
<switch checked type="switch" bindchange="switchBindchange"/>
<view>開關(guān)組件當前狀態(tài)：{{switchState}}</view>
② index.js
Page({
data:{
// text:"這是一個頁面"
min:'20',
max:'150',
text:'',
switchState:'開'
},
sliderBindchange:function(e){
this.setData({
text:e.detail.value
})
},
switchBindchange:function(e){
if(e.detail.value){
this.setData({
switchState:'開'
})
}else{
this.setData({
switchState:'關(guān)'
})
}
}
})
3、源代碼點擊此處本站下載。
關(guān)于slider與switch組件的詳細說明與使用方法可參考官網(wǎng)：
https://mp.weixin.qq.com/debug/wxadoc/dev/component/slider.html
https://mp.weixin.qq.com/debug/wxadoc/dev/component/switch.html
希望本文所述對大家微信小程序開發(fā)有所幫助。
相關(guān)文章
這篇文章主要為大家詳細介紹了JavaScript動態(tài)綁定，關(guān)于JavaScript中為元素綁定的事件失效的解決方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-09-09
這篇文章主要為大家詳細介紹了js實現(xiàn)拾色器插件ColorPicker，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-05-05
javascript中常見的3種信息提示框(alert,prompt,confirm)
2012-09-09
Bootstrap實現(xiàn)漸變頂部固定自適應(yīng)導(dǎo)航欄
這篇文章給大家介紹了Bootstrap實現(xiàn)漸變頂部固定自適應(yīng)導(dǎo)航欄，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-01-01
這篇文章主要介紹了js實現(xiàn)點擊圖片在屏幕中間彈出放大效果,非常不錯，具有一定的參考借鑒價值，需要的朋友可以參考下2019-09-09
關(guān)于JavaScript數(shù)組去重的一些理解匯總
這篇文章主要給大家介紹了關(guān)于JavaScript數(shù)組去重的一些理解，文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值，需要的朋友們下面隨著小編來一起學習學習吧2020-09-09
本篇文章主要介紹了原生JS實現(xiàn)垂直手風琴效果的示例代碼，具有很好的參考價值，下面跟著小編一起來看下吧2017-02-02
Javascript中的對像賦值與Java中是一樣的,都為引用傳遞.就是說,在把一個對像賦值給一個變量時,那么這個變量所指向的仍就是原來對像的地址.那怎么來做呢 答案是克隆.2008-12-12
本篇文章主要介紹了js中幾種實用的跨域方法原理詳解 ，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。2016-12-12
JavaScript監(jiān)聽手機物理返回鍵的兩種解決方法
JavaScript沒有監(jiān)聽物理返回鍵的API，所以只能使用 popstate 事件監(jiān)聽。接下來通過本文給大家分享JavaScript監(jiān)聽手機物理返回鍵的兩種解決方法，感興趣的朋友一起看看吧2017-08-08