微信小程序之switch開(kāi)關(guān)選擇器

switch開(kāi)關(guān)選擇器應(yīng)用得十分普遍,它有兩個(gè)狀態(tài):開(kāi)或是關(guān),在很多場(chǎng)景都會(huì)用到開(kāi)關(guān)這個(gè)功能,如微信設(shè)置里的“新消息提醒”界面,通過(guò)開(kāi)關(guān)來(lái)設(shè)置是否接受消息,顯示消息,是否有聲音,是否有震動(dòng)等功能。

switch開(kāi)關(guān)選擇器的屬性可以設(shè)置是否選中,開(kāi)關(guān)類(lèi)型,顏色以及綁定事件

屬性名 類(lèi)型 默認(rèn)值 說(shuō)明
checked Boolean false 是否選中
disabled Boolean false 是否禁用
type String switch 樣式,有效值:switch, checkbox
bindchange EventHandle checked 改變時(shí)觸發(fā) change 事件, event.detail={ value:checked}
color Color switch 的顏色,同 css 的 color

wxml文件

<view class="body-view">
    <switch checked bindchange="switch1Change"/>
    <switch bindchange="switch2Change"/>
</view>

js文件

Page({
  switch1Change: function (e){
    console.log('switch1 發(fā)生 change 事件,攜帶值為', e.detail.value)
  },
  switch2Change: function (e){
    console.log('switch2 發(fā)生 change 事件,攜帶值為', e.detail.value)
  }
})

效果


?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀(guān)點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

推薦閱讀更多精彩內(nèi)容