小程序开放平台

文档中心
表单组件
button
checkbox
checkbox-group
editor
form
input
label
picker
picker-view
picker-view-column
radio
radio-group
slider
switch
textarea
基础内容
媒体组件
地图
视图容器
开放能力
画布

switch

开发
>
组件
>
表单组件
>
switch
>
更新时间:2024-11-13 19:05:26

switch

开关选择器

属性
类型
默认值
必填
说明
checkedbooleanfalse是否选中
disabledbooleanfalse是否禁用
typestringswitch样式,有效值:switch, checkbox
colorstring#04BE02switch 的颜色,同 css 的 color
bindchangeeventhandlechecked 改变时触发 change 事件,event.detail={ value}

扫码预览

组件示例

<view class="container">
  <switch checked color="rgba(255, 36, 66, 1)" style="--a4abe58c: #777;"/>
  <switch class="_ml8" checked color="rgba(255, 36, 66, 0.4)" disabled/>
  <switch class="_ml8" checked="{{false}}" color="rgba(255, 36, 66, 1)"/>
  <switch class="_ml8"  color="rgba(255, 36, 66, 1)"/>

  <view class="_dflex _jc_space-between _py6 _ai_center"> 
    <text>
      标题描述
    </text>
    <switch checked color="rgba(255, 36, 66, 1)"/>
  </view>
  <view class="_dflex _jc_space-between _py6 _ai_center">
    <view>
      <view class="switch_font_title">
        标题描述
      </view>
      <view class="switch_font_sub">
        可添加二级描述文本
      </view>
    </view>
    <switch checked="{{false}}" color="rgba(255, 36, 66, 1)"/>
  </view>
</view>
该文档是否对您有帮助?