表单组件checkbox:官方文档

Demo Code:

JS

Page({
data:{
items:[
{name: 'USA', value: '美国'},
{name: 'CHN', value: '中国', checked: 'true'},
{name: 'BRA', value: '巴西'},
{name: 'JPN', value: '日本'},
{name: 'ENG', value: '英国'},
{name: 'TUR', value: '法国'}
]
},
checkboxChange:function(options){
console.log('checkbox发生change事件,携带value值为:', options.detail.value);
}
})

WXML:

<checkbox-group bindchange="checkboxChange">
<label class="checkbox" wx:for="{{items}}">
<checkbox value="{{item.name}}" checked="{{item.checked}}" />{{item.value}}
</label>
</checkbox-group>

WXSS:

.checkbox{
display:block;
margin-left:10px;
margin-top:5px;
}

微信小程序组件checkbox的更多相关文章

  1. 微信小程序组件设计规范

    微信小程序组件设计规范 组件化开发的思想贯穿着我开发设计过程的始终.在过去很长一段时间里,我都受益于这种思想. 组件可复用 - 减少了重复代码量 组件做为抽离的功能单元 - 方便维护 组件作为temp ...

  2. 微信小程序组件学习 -- 注册页面

    微信小程序组件使用手册地址: 1. 百度搜索"微信公众平台",扫码登录之后,点击帮助文档里面的普通小程序. 2. 接着选择"开发"-->"组件& ...

  3. 微信小程序——组件(二)

    在上篇文章组件(一)里已经讲解了如何创建一个项目,现在继续...讲解一个页面布局以及各个组件的使用.在学习过程中,发现小程序支持flex布局,这对于学习过react native的人来说太好了,布局方 ...

  4. 微信小程序组件构建UI界面小练手 —— 表单登录注册微信小程序

    通过微信小程序中丰富的表单组件来完成登录界面.手机快速注册界面.企业用户注册界面的微信小程序设计. 将会用到view视图容器组件.button按钮组件.image图片组件.input输入框组件.che ...

  5. 【腾讯Bugly干货分享】打造“微信小程序”组件化开发框架

    本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com/s/2nQzsuqq7Avgs8wsRizUhw 作者:Gc ...

  6. 微信小程序(组件demo)以及预览方法:(小程序交流群:604788754)

    1. 获取微信小程序的 AppID 登录 https://mp.weixin.qq.com ,就可以在网站的"设置"-"开发者设置"中,查看到微信小程序的 Ap ...

  7. 详解封装微信小程序组件及小程序坑(附带解决方案)

    一.序 上一篇介绍了如何从零开发微信小程序,博客园审核变智障了,每次代码都不算篇幅,好好滴一篇原创,不到3分钟从首页移出来了.这篇介绍一下组件封装和我的踩坑历程. 二.封装微信小程序可复用组件 首先模 ...

  8. 微信小程序组件通信

    父子通信 在子组件的对应js中 properties:{ prop名字:数据类型, prop名字:{ type:数据类型, value:默认值 } } 在父组件的wxml模板中找到子组件标签 < ...

  9. 微信小程序组件化实践

    Do Not Repeat Yourself 如何提高代码质量,方法有许多:抽象.模块.组件化,我认为它们的中心点都是--Do Not Repeat Yourself. 小程序组件化 我们先看看小程序 ...

随机推荐

  1. SonarQube代码质量管理平台安装与配置

    1.安装说明 操作用户:root 软件下载目录:/root/opt 无root权限时,放到自定义目录即可 ================ 2.预置条件 1.需要JDK1.6+支持: 2.需要Mysq ...

  2. JavaScript如何实现计时功能。

    JavaScript如何实现计时功能. 解答:<script> window.setTimeout( “window.location = ‘http://www.csdn.net ‘; ...

  3. js常用API汇总(转)

    typeof(); 检测数据类型 String(); 转换成字符串 parseInt(); 解析出一个string或number的整数部分 parseFloat(); 解析出一个string的浮点数部 ...

  4. java强软弱虚引用详解(转载)

    转载自:http://zhangjunhd.blog.51cto.com/113473/53092/ ava:对象的强.软.弱和虚引用 2007-12-01 17:20:20 标签:Java 软引用  ...

  5. Ubuntu系统-网络配置

    网络配置 静态IP root@ubuntu:~# cat /etc/network/interfaces # This file describes the network interfaces av ...

  6. AderTemplate

    http://www.cnblogs.com/kwklover/archive/2007/07/12/815509.html 概述 AderTemplate是一个小型的模板引擎.无论是拿来直接使用还是 ...

  7. Echoprint系列--编译

    近期要做一个音乐相关的client.当中一个功能是音乐识别.搜索了一些资料选择Echoprint来开发.Echoprint是开源免费的,并且多种client都支持能节约非常多时间,今天主要下载和编译源 ...

  8. 【BZOJ4503】两个串 FFT

    [BZOJ4503]两个串 Description 兔子们在玩两个串的游戏.给定两个字符串S和T,兔子们想知道T在S中出现了几次, 分别在哪些位置出现.注意T中可能有“?”字符,这个字符可以匹配任何字 ...

  9. ZOJ 1648 Circuit Board(计算几何)

    Circuit Board Time Limit: 2 Seconds Memory Limit: 65536 KB On the circuit board, there are lots of c ...

  10. Twitter的RPC框架Finagle简介

    Twitter的RPC框架Finagle简介 http://www.infoq.com/cn/news/2014/05/twitter-finagle-intro