《微信小程序开发从入门到实战》学习二十二

3.3 开发创建投票页面

3.3.10 使用switch开关组件

用switch开关组件增加一个设置是否匿名投票的功能。

switch常用属性如下:

checked 开还是关,默认false关

disabled 是否禁用,默认false不禁用,可以开关

color switch的颜色,有默认色

bindchange checked改变时触发的事件处理函数

修改JS文件,在data对象加入一个用于保存是否匿名投票的变量:

isAnonymous: false

同时增加一个switch开关变化触发的事件处理函数:

onChangeIsAnnoymous(e) {

this.setData({

isAnonymous: e.detail.value

})

}

最后修改wxml文件,在"截止日期"设置的下方添加如下代码:

<view class="form-item">

<text class="form-item-label">匿名投票</text>

<switch checked="{{isAnonymous}}" bindchange="onChangeIsAnnoymous"/>

</view>

样式可以复用"截止日期"设置的样式,无须编写样式代码。

预览如下所示:

相关推荐
dadaobusi5 小时前
学习: PCIe 6.0 的 L0p
学习
燕落南枝7 小时前
CSS 学习:类型选择器与 AI 注释实战
css·人工智能·学习
Swilderrr11 小时前
论文精读:《Directory-Aware Query and Maintenance in Vector Databases》
笔记·学习
kkkkkkkkkk_Z11 小时前
新手自学嵌入式 | 学习日记:LCD显示原理、PWM控制、电容触摸屏(GT9147)驱动开发与项目实战
驱动开发·学习
LXT71212 小时前
每日英语一读|为什么夏天的雷雨,总爱在傍晚出现?
深度学习·学习
知识分享小能手12 小时前
C学习教程,从入门到精通,C语言文件 — 完整知识点详解(14)
c语言·网络·学习
羊羊一洋12 小时前
ROM&RAM
c语言·stm32·学习
txc13 小时前
我用 AI 给两个人写了个微信小程序(二):从「能用」到「用得对」
微信小程序
优化Henry13 小时前
LTE小区光路降质告警排查与处理实录
运维·网络·学习·5g·tdd
暖馒13 小时前
运动控制框架相关知识
学习