小程序的switch组件
小程序的switch开关组件,总结下大概有三种使用场景。
其一: 纯展示场景, 用来展示某个开关值是打开还是关闭的,这个场景比较简单,给个disabled属性就ok了;
其二: 用户点击后立即切换开关值。
以上两种场景都是比较常规的使用场景,下面说下第三种场景
当用户点击后不能立即切换开关状态,需要先执行一些检查,最后判断是否需要切换开关状态。
此种场景下不能简单的使用switch组件,实现思路如下:
将switch组件包裹到view组件内部; switch组件设置为disabled, 不监听change事件,给switch的checked属性传递一个变量值。当用户点击switch时触发的view组件的click事件,在click事件里做一些处理,最后判断是否需要改变开关状态,如果需要改变则设置调用setData设置传给switch组件checked属性的变量值。
小程序的switch组件的更多相关文章
- 小程序自定义switch组件
如上图,小程序api中的switch组件只能自定义颜色,不能自定义宽高,所以就开始了自己写switch组件. 自定义组件样式 switch组件样式大致如图,样式思路:未选中时为一个长方形有圆角按钮,和 ...
- 原创:WeZRender:微信小程序Canvas增强组件
WeZRender是一个微信小程序Canvas增强组件,基于HTML5 Canvas类库ZRender. 使用 WXML: <canvas style="width: 375px; h ...
- 微信小程序之swiper组件高度自适应
微信小程序之swiper组件高度自适应 要求: (顶部广告栏 ) 改变swiper组件的固定高度,使之随内部每张图片的高度做自适应 原理: 图片加载完之后,获取图片的原始宽高,根据宽高比,计算出适应后 ...
- 微信小程序中的组件使用1
不管是vue还是react中,都在强调组件思想,同样,在微信小程序中也是使用组件思想来实现页面复用的,下面就简单介绍一下微信小程序中的组件思想. 组件定义与使用 要使用组件,首先需要有组件页面和使用组 ...
- 小程序解决方案 Westore - 组件、纯组件、插件开发
数据流转 先上一张图看清 Westore 怎么解决小程序数据难以管理和维护的问题: 非纯组件的话,可以直接省去 triggerEvent 的过程,直接修改 store.data 并且 update,形 ...
- 【小程序】小程序开发自定义组件的步骤>>>>>>>>>小程序开发过程中报错:jsEnginScriptError
报错:jsEnginScriptError VM6342: jsEnginScriptError Component is not found in path "component/spac ...
- 微信小程序中的组件
前言 之前做小程序开发的时候,对于开发来说比较头疼的莫过于自定义组件了,当时官方对这方面的文档也只是寥寥几句,一笔带过而已,所以写起来真的是非常非常痛苦!! 好在微信小程序的库从 1.6.3 开始,官 ...
- 微信小程序之自定义组件的应用
小程序支持自定义组件,下面是一个简单的购物车组件,实现的效果如图: 效果图 创建组件 在根目录创建components目录,然后创建计数组件 count 如图: 组件内容 <!--compone ...
- 微信小程序自定义音频组件,自定义滚动条,单曲循环,循环播放
小程序自定义音频组件,带滚动条 摘要:首先自定义音频组件,是因为产品有这样的需求,需要如下样式的 而微信小程序API给我们提供的就是这样的 而且产品需要小程序有后台播放功能,所以我们不考虑小程序的 a ...
随机推荐
- C/C++的区别
C和C++的关系:就像是win98跟winXP的关系.C++是在C的基础上增加了新的理论,玩出了新的花样.所以叫C加加. C和C++的区别: C是一个结构化语言,它的重点在于算法和数据结构.C程序的设 ...
- Nios程序烧写到EPCS方法 - 第1页 - asus119's Blog - EDN China电子设计技术
Nios程序烧写到EPCS方法 - 第1页 - asus119's Blog - EDN China电子设计技术 这里主要是针对EP3C系列FPGA的Nios程序固化到EPCS中的方法做简要说明.硬件 ...
- 【256】◀▶IEW-答案
附答案 Unit I Fast food Model Answers: Model 1 The pie chart shows the fast foods that teenagers prefer ...
- ResultSetMetaData和ResultSet
我现在有一张表t_product;我们查询所有的商品:SELECT * FROM t_product; 上述所有的数据都可以封装成一个对象,我们称这个查询出来的对象为结果集对象:ResultSet. ...
- [hdu1712]ACboy needs your help分组背包
题意:一共$m$天,$n$门课程,每门课程花费$i$天得到$j$的价值,求最后获得的最大价值 解题关键:分组背包练习,注意循环的顺序不能颠倒 伪代码: $for$ 所有的组$k$ $for{\rm ...
- 实现Unity对Dictionary的序列化
若有尝试过想在unity的inspector检视面板中像List或者数组那样可以编辑Dictionary变量的童鞋应该知道,Dictionary变量不会出现在inspector中,unity并不会直接 ...
- How to install Samba server on Ubuntu 12.04
Part 1: Configuring anonymous share with samba server To install the samba package,enter the followi ...
- “MVC+Nhibernate+Jquery-EasyUI” 信息发布系统 第三篇(登录窗口的实现以及如何保存登录者的信息)
一.前言: 1.再看这篇文章的时候,您是否已经完成前两篇介绍的文章里的功能了?(Tabs页的添加,Tabs页右键的关闭,主题的更换) 2.今天来说说登录窗口吧,看截图: ...
- 常见错误及处理-jsp及Servlet
1.servlet输入出页面时,中文字符乱码 解决方法: 在Writer之前设置请求头: response.setHeader("Content-type", "text ...
- Nginx + Tomcat7 + redis session一致性问题
Nginx 作负载均衡时,由于是每次都需要把请求分发到不同的机器,同一个用户在一台机器上创建了 session,下一次的请求很有可能会转发到另外一台机器,会造成 session 丢失.我们可以使用 R ...