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

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>

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

预览如下所示:

相关推荐
woshihuanglaoshi1 小时前
事务加持防超卖:ArkTS 在鸿蒙里玩转 TRANSACTION 出入库
学习·华为·harmonyos
世人万千丶1 小时前
去重插入与超限淘汰:ArkTS 实现鸿蒙搜索历史的 LIMIT 艺术
运维·服务器·学习·华为·harmonyos·鸿蒙
2601_949950632 小时前
在线练题更方便,用练题簿打造属于自己的移动题库
学习·考研·刷题·小程序推荐
woshihuanglaoshi3 小时前
十二商品二十流水:鸿蒙进销存种子数据装满预警看板
学习·华为·harmonyos
MartinYeung53 小时前
[论文学习]ProAct:针对LLM越狱的主动防禦框架
网络·学习·安全
weixin_431600444 小时前
NestJS 入门(10):日志——为什么常用 Winston?
后端·学习·日志·nest.js·winston
何事误红尘4 小时前
ZYNQ学习ARM裸机笔记():VITIS
学习
不懂的浪漫5 小时前
吴恩达《AI Engineering Skills Map》译读:四项核心能力与持续学习底座
人工智能·学习
蒸蒸yyyyzwd6 小时前
cpp选手秋招准备 学习笔记day7 webserver
笔记·学习
lifallen6 小时前
DeepSeek Harness:把 Agent 做成可替换的运行时插件树
人工智能·学习·ai·开源软件·ai编程