這篇文章主要介紹了微信小程式使用slider設定資料值及switch開關元件功能,結合實例形式分析了slider元件及switch元件的功能與使用方法,並附帶原始碼供讀者下載參考,需要的朋友可以參考下
本文實例講述了微信小程式使用slider設定資料值及switch開關元件功能。分享給大家供大家參考,具體如下:
關鍵代碼
① 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>微信小程序组件:开关组件switch</view> <switch checked type="switch" bindchange="switchBindchange"/> <view>开关组件当前状态:{{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:'关' }) } } })
上面是我整理給大家的,希望未來會對大家有幫助。
相關文章:
以上是在微信小程式中如何使用slider設定資料值的詳細內容。更多資訊請關注PHP中文網其他相關文章!