switch

开关选择器。 属性说明 示例

  1. <template> <view> <view class="uni-padding-wrap uni-common-mt"> <view class="uni-title">默认样式</view> <view> <switch checked @change="switch1Change" /> <switch @change="switch2Change" /> </view> <view class="uni-title">推荐展示样式</view> </view> <view class="uni-list"> <view class="uni-list-cell uni-list-cell-pd"> <view class="uni-list-cell-db">开启中</view> <switch checked /> </view> <view class="uni-list-cell uni-list-cell-pd"> <view class="uni-list-cell-db">关闭</view> <switch /> </view> </view> </view></template>
  1. export default { data() { return {} }, methods: { switch1Change: function (e) { console.log('switch1 发生 change 事件,携带值为', e.target.value) }, switch2Change: function (e) { console.log('switch2 发生 change 事件,携带值为', e.target.value) } }}

示例代码说明:以上示例代码从hello uni-app示例中复制,涉及的css样式在hello uni-app的app.vue和uni.css中 https://uniapp.dcloud.io/h5/pages/component/switch/switch 注意

  • style="transform:scale(0.7)"

在 GitHub 上编辑此页面!