微信小程序checkbox排列方向
来源:互联网 发布:页游 知乎 编辑:程序博客网 时间:2024/05/16 15:06
关于微信小程序中的checkbox组件,需要在checkbox-grop包裹下,在添加一个标签来包裹,在不考虑排列放下的前提下默认排列是水平的
module.js
Page({ data: { imageUrls: ['http://img02.tooopen.com/images/20150928/tooopen_sy_143912755726.jpg', 'http://img06.tooopen.com/images/20160818/tooopen_sy_175866434296.jpg', 'http://img06.tooopen.com/images/20160818/tooopen_sy_175833047715.jpg'], inter: 2000, items: [ { name: 'USA', value: '美国' }, { name: 'CHN', value: '中国', checked: 'true' }, { name: 'BRA', value: '巴西' }, { name: 'JPN', value: '日本' }, { name: 'ENG', value: '英国' }, { name: 'TUR', value: '法国' }, ] }, checkboxChange: function (e) { console.log('checkbox发生chang事件', e.detail.value) }})
module.wxml
<checkbox-group bindchange="checkboxChange"> <label wx:for="{{items}}"> <checkbox value="{{item.name}}" checked="{{item.checked}}">{{item.value}}</checkbox> </label></checkbox-group>
当checkbox在label标签包裹下需要垂直排列的时候
module.wxml
<checkbox-group bindchange="checkboxChange"> <label style="display:flex;" wx:for="{{items}}"> <checkbox value="{{item.name}}" checked="{{item.checked}}">{{item.value}}</checkbox> </label></checkbox-group>
当checkbox在view标签包裹下需要垂直排列的时候
module.wxml
<checkbox-group bindchange="checkboxChange"> <view style="flex-direction:column;" wx:for="{{items}}"> <checkbox value="{{item.name}}" checked="{{item.checked}}">{{item.value}}</checkbox> </view></checkbox-group>
0 0
- 微信小程序checkbox排列方向
- 微信小程序-checkbox
- 微信小程序----组件之checkbox
- 微信小程序全选,微信小程序checkbox,微信小程序购物车
- 微信小程序全选,微信小程序checkbox,微信小程序购物车
- 微信小程序把玩(十五)checkbox组件
- 2.3.2微信小程序表单组件 checkbox
- 微信小程序checkbox选中改变样式
- WPF listbox中Checkbox横向排列
- 全排列程序
- 全排列程序
- 小程序:全排列
- 微信小程序例子——checkbox的使用
- 微信小程序学习(11)-checkbox控件和label标签
- 微信小程序学习(八)之checkbox组件
- 微信小程序icon,text,progress,button,checkbox,form
- 微信小程序 —— 多选checkbox选中之后改变样式
- Android 自定义 CheckBox 文字与图标的方向
- Java总结篇系列:Java多线程(一)
- 数据分析与数据挖掘在常规工作中的应用——数据 离散化
- u-boot之添加一块新板子的支持
- 深入了解JAVA可变长度的参数(Varargs)
- support-percent
- 微信小程序checkbox排列方向
- 4.面向对象
- 【9-1-7】链表的冒泡 bubblesort
- 419. Battleships in a Board 难度:medium
- ES6的变量声明
- 66. Plus One
- 2017年了,别再混日子了
- openjdk8的安装
- linux环境下找出今天被修改的文件