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

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>

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

预览如下所示:

相关推荐
math_hongfan1 小时前
鸿蒙离线数据缓存高级架构:弱网预加载/离线数据优先级/同步冲突解决/上线后数据合并策略
学习·缓存·华为·架构·harmonyos·鸿蒙
划水的code搬运工小李1 小时前
Simulink学习-自定义Storage Class配置
学习
一尘之中2 小时前
量子计算机能“参禅”吗?从叠加态到不二法门的技术哲学追问
学习·ai写作·量子计算
什么都干的派森2 小时前
高速PCB设计学习记录(更新中)
学习·高速pcb设计
lifallen3 小时前
Emdash 拆解:多 Agent 并行开发桌面端的实现思路,兼谈 ACP 与 A2A
人工智能·学习·ai·ai编程
sam-zy4 小时前
微信小程序+ESP8266+Arduino 开发智能插座,有本地OTA功能
微信小程序·小程序
迪丽热爱4 小时前
每日英语-7
学习
LccKyI5 小时前
C#学习day04
经验分享·笔记·学习·c#
math_hongfan5 小时前
鸿蒙企业级数据存储高级架构:从读写分离到冷热数据分层/归档策略/数据生命周期管理最佳实践
人工智能·学习·华为·架构·harmonyos·鸿蒙
MartinYeung55 小时前
[论文学习]LLM智能体无法保密:多智能体系统中的隐私评估
人工智能·学习