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

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>

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

预览如下所示:

相关推荐
云深处@6 小时前
【数据库】MySQL 入门
数据库·学习·mysql
HyperAI超神经6 小时前
【vLLM 学习】Disaggregated Prefill
人工智能·深度学习·学习·vllm
天吾cc7 小时前
RTT-IO设备模型
单片机·嵌入式硬件·学习
美味蛋炒饭.7 小时前
Git 版本控制(下)
开发语言·git·学习·总结·后端开发
呼噜想睡觉7 小时前
Bootstrap 组件之响应式导航条实现
学习
菜鸟‍8 小时前
【论文学习】Medical Image Analysis 2024 || 医学图像分割中失败检测方法的比较基准研究:揭示置信度聚合的作用
人工智能·学习
爱音乐的marlon8 小时前
FastAPI 学习笔记03|core 核心层:config 是总控制台,database 是整个工程的地基
笔记·学习·fastapi
math_hongfan10 小时前
鸿蒙离线数据缓存高级架构:弱网预加载/离线数据优先级/同步冲突解决/上线后数据合并策略
学习·缓存·华为·架构·harmonyos·鸿蒙
划水的code搬运工小李10 小时前
Simulink学习-自定义Storage Class配置
学习
一尘之中11 小时前
量子计算机能“参禅”吗?从叠加态到不二法门的技术哲学追问
学习·ai写作·量子计算