养生 装修 购物 美食 感冒 便秘 营销 加盟 小吃 火锅 管理 创业 搭配 减肥 培训 旅游

微信小程序表单类组件switch开关选择器使用详解

时间:2024-10-22 08:27:42

本篇经验将继续分享表单类组件中switch开关选择器组件的使用详解。经验基于第一个手工构建的微信小程序演示,具体构建步骤,可参考如下经验引用。

微信小程序表单类组件switch开关选择器使用详解

工具/原料

微信开发者工具

方法/步骤

1、先百度搜索查看switch开关选择器组件的官方评鲦易纪文档,其比较常用的属性有type(样式类型,可选switch和checkbox),color(开关的颜色)。

微信小程序表单类组件switch开关选择器使用详解

2、在wxml中通过<switch>标签创建2个开关选择器,分谧摅嵝羟别如下配置:1.配置属性type牾肟甘道为"switch",并绑定change事件回调函数;2.配置属性type为"checkbox"以及color,并绑定change事件回调函数。

微信小程序表单类组件switch开关选择器使用详解

3、js文件中定义上面绑定的事件回调函数。

微信小程序表单类组件switch开关选择器使用详解

4、wxss中声明wxml中使用的类的样式定义。

微信小程序表单类组件switch开关选择器使用详解

5、保存编译后,模拟器显示的页面效果符合预期,修改开关选择器的开关状态,在模拟器中可以看到绑定的回调函数被触发执行。

微信小程序表单类组件switch开关选择器使用详解

© 一点知识