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

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>

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

预览如下所示:

相关推荐
代码山河7 小时前
Python就业方向全解析:后端、爬虫、数据分析、AI你选哪个?
python·学习·架构·教程·面向对象·项目
释厄6238 小时前
AI学习层更新与跨体转移律——人类社会同构·不缺理解缺 U
人工智能·学习
ngaiwe8 小时前
AA我来算小程序实践:把付款人、承担人和结算状态分开建模
微信小程序
小嘉丶学长12 小时前
Day14 · 字典与集合
java·开发语言·网络·python·学习·1024程序员节
小李不想当小白12 小时前
SPI通信外设与W25Q64 (硬件SPI)(STM32标准库学习笔记)
笔记·stm32·单片机·嵌入式硬件·学习·嵌入式
adinnet202616 小时前
电商客服对话知识库的自学习闭环与质量演进机制
学习
lazy H17 小时前
【计算机网络】第 13 篇:NAT 和端口映射是什么?为什么本地服务外网访问不了?
java·网络·网络协议·学习·计算机网络·408
试剂界的爱马仕18 小时前
α-Cyano-4-hydroxycinnamic acid(CHCA)用作 MALDI-TOF 基质的配制与使用
大数据·人工智能·深度学习·学习
小向是个Der18 小时前
嵌入式进阶——编译与链接
汇编·单片机·学习·编译原理·交叉编译
学网安的肆伍19 小时前
认证机制攻防学习|PortSwigger Authentication 靶场复现总结(二):用户名枚举进阶
学习·web安全·网络安全·burpsuite·portswigger·认证安全·靶场复现