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

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>

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

预览如下所示:

相关推荐
沉浸式学习ing15 小时前
播客和视频怎么变成知识库里的笔记?音视频转结构化笔记完整方案
人工智能·笔记·gpt·学习·ai·音视频·notion
知识分享小能手15 小时前
R语言入门学习教程,从入门到精通,R语言数据处理与清洗 (9)
开发语言·学习·r语言
炽烈小老头15 小时前
【 每天学习一点算法 2026/05/14】单词接龙
学习·算法
yxc_inspire15 小时前
24年CCPC山东邀请赛补题
学习·算法
red_redemption15 小时前
自由学习记录(187)
学习
nashane15 小时前
HarmonyOS 6学习:Web组件与JavaScript交互的三大高频问题与终极解决方案
前端·学习·harmonyos
凉、介16 小时前
ARM GICv3 学习笔记(一)
arm开发·笔记·学习·嵌入式
YangYang9YangYan16 小时前
产品经理学习数据分析的价值与路径
学习·数据分析·产品经理
星夜夏空9916 小时前
STM32单片机学习(13) —— 串口通信协议
stm32·单片机·学习
柿柿快乐16 小时前
用户认证系统实现文档
linux·服务器·网络·学习·基础教学