All Products
Search
Document Center

switch

Last Updated: Apr 19, 2021

This topic describes switch, the single-choice item.

Attribute Type Default value Description Minimum version
name String - The component name, which is used to submit the form to obtain data. -
checked Boolean - Whether to select. -
disabled Boolean - Whether to disable the button. -
color String - The component color. -
onChange EventHandle - Trigger when checked is modified, where event.detail={value:checked}. -
controlled Boolean false Whether the component is a controlled component. If the value is true, checked is fully controlled by setData. 1.8.0
color Color - The switch color. 1.10.0

Illustration

Code sample

 
  1. <view class="page">
  2. <view class="switch-list">
  3. <view class="switch-item">
  4. <switch checked onChange="switchChange"/>
  5. </view>
  6. </view>
  7. </view>
 
  1. Page({
  2. switchChange (e){
  3. console.log('The switchChange event, and the value is: ', e.detail.value)
  4. },
  5. })