表单组件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. php 判断时间是否超过

    $str="2014-10-11"; echo "".strtotime($str); echo "<br/>"; echo & ...

  2. 判断下列语句是否正确,如果有错误,请指出错误所在?interface A{

    判断下列语句是否正确,如果有错误,请指出错误所在? interface A{ int add(final A a); } class B implements A{ long add(final A ...

  3. Java IO系统

    理论上,我们可将任何程序分割为三部分:输入.处理和输出.这意味着 IO(输入/输出)是所有程序最为关键的部分.在这一章中,大家将学习Java 为此提供的各种类,如何用它们读写文件.内存块以及控制台 等 ...

  4. 【BZOJ】3301: [USACO2011 Feb] Cow Line(康托展开)

    http://www.lydsy.com/JudgeOnline/problem.php?id=3301 其实这一题很早就a过了,但是那时候看题解写完也是似懂非懂的.... 听zyf神犇说是康托展开, ...

  5. Java入门 第一季第六章 数组

    这是我学习慕课网Java课程的笔记,原视频链接为:http://www.imooc.com/learn/85 6-1什么是数组 数组中的元素都能够通过下标来訪问.下标从 0 開始.比如,能够通过 sc ...

  6. 【转】HDC,CDC,CWindowDC,CClientDC,CPaintDC等等

     转载出处:http://blog.sina.com.cn/s/blog_447611f20100lirt.html 首先说一下什么是DC(设备描述表) Windows应用程序通过为指定设备(屏幕,打 ...

  7. Android获取 应用程序大小,数据大小,缓存大小

    在项目中创建,android.content.pm 包名.里面创建两个aidl文件.PackageStats.aidl  和 IPackageStatsObserver.aidl. PackageSt ...

  8. shopxx----权限添加

    shiro权限控制 一.角色管理请求地址 1.模板地址 /shopxx/WebContent/WEB-INF/template/admin/role/list.ftl shiro 权限拦截 配置安全管 ...

  9. form.submit 方法 并不会触发 form.onsubmit 事件

    做表单的时候发现一个奇怪的地方,总结下: form.submit 方法 并不会触发 form.onsubmit 事件,看代码: <body> <div class="con ...

  10. StackExchange.Redis性能调优

    大家经常出现同步调用Redis超时的问题,但改成异步之后发现错误非常少了,但却可能通过前后记日志之类的发现Redis命令非常慢. PS: 以后代码都在Windows bash中运行,StackExch ...