电子类网站建设需要多少钱,厦门软件公司排名,自助网站建设开发流程步骤,房地产经纪人资格证7.3 表单组件
7.3.1 picke-view与picker-view-column组件
一个picker-view-column代表 一个滚动选择器子项#xff0c;一个picker-view组件可以包含多个picker-view-column组件#xff0c;这样可以一次性选择多项内容如年、月、日等。
picker-view-column组件中需包含多个…7.3 表单组件
7.3.1 picke-view与picker-view-column组件
一个picker-view-column代表 一个滚动选择器子项一个picker-view组件可以包含多个picker-view-column组件这样可以一次性选择多项内容如年、月、日等。
picker-view-column组件中需包含多个子元素这些子元素是滚动选择器子项的选项列表。
picker-view组件支持的属性如下所示
属性类型说明最低版本valuenumber[]数组中的数组依次表示为picker-view内的picker-view-column选项的第几项下标从0开始。数字大于picker-view-column可选性长度时选择最后一项1.0.0indicator-stylestring设置选择器中间选中项的样式1.0.0indicator-classstring设置选择器中间选中项的类名1.1.0mask-stylestring设置蒙层的样式1.5.0mask-classstring设置蒙层的类名1.5.0bindchangeeventhandle滚动选择时触发change事件event.detail{value};value为数组表示picker-view内的picker-view-column当前选择的第几项下标从0开始 1.0.0bindpickstarteventhandle当滚动选择开始时触发事件2.3.1bindpickendeventhandle当滚动选择结束时触发事件2.3.1
日期选择的示例代码如下三个picker-view-column代表年、月、日的选择子项
!--WXML--
view view styletext-align:center;{{year}}年{{month}}月{{day}}日/view picker-view indicator-styleheight:50px stylewidth: 100%;height: 300px; value{{value}} bindchangebindChange picker-view-column view wx:for{{years}} styleline-height: 50px;{{item}}年/view /picker-view-column picker-view-column view wx:for{{months}} styleline-height: 50px;{{item}}月/view /picker-view-column picker-view-column view wx:for{{days}} styleline-height: 50px;{{item}}日/view /picker-view-column /picker-view
/view // JS
const date new Date()
const years []
const months []
const days []
for (let i 1990; i date.getFullYear(); i) { years.push(i)
}
for (let i 1; i 12; i) { months.push(i)
}
for (let i 1; i 31; i) { days.push(i)
}
Page({ /** * 页面的初始数据 */ data: { years: years, year: date.getFullYear(), months: months, month: 2, days: days, day: 2, value: [9999,1,1] }, bindChange: function(e){ const val e.detail.value this.setData({ year: this.data.years[val[0]], month: this.data.months[val[1]], day: this.data.days[val[2]] }) }
})
