最近在做一个类似历史上的今天的项目,里面用到了一个时间选择器,但是官方的date picker并没有隐藏年份的方法,于是照着官方文档改了一下。
用到的是官方picker 的多列选择器:mode = multiSelector 本着开源精神就把代码po出来
具体实现如下:
在wxml中:
多列选择器
当前选择:{ {multiArray[0][multiIndex[0]]}}-{ {multiArray[1][multiIndex[1]]}} 复制代码
在js中:
data: {
multiArray: [['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12'], ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31' ]],multiIndex: [0, 0],复制代码
},
bindMultiPickerColumnChange: function (e) {
console.log('修改的列为', e.detail.column, ',值为', e.detail.value);var data = { multiArray: this.data.multiArray, multiIndex: this.data.multiIndex};data.multiIndex[e.detail.column] = e.detail.value;switch (e.detail.column){ case 0: switch (data.multiIndex[0]) { case 1: data.multiArray[1] = ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29' ]; break; default: data.multiArray[1] = ['01', '02', '03', '04', '05', '06', '07', '08', '09', '10', '11', '12', '13', '14', '15', '16', '17', '18', '19', '20', '21', '22', '23', '24', '25', '26', '27', '28', '29', '30', '31' ]; break; } data.multiIndex[1] = 0; data.multiIndex[2] = 0; break;}this.setData(data);复制代码
}
代码就是这样:
switch 判断中的data.multiIndex[0] ,case1 的情况是判断了2月份有29天,default 是判断了除了2月份其他月份都是31天。具体30天或者31天,照着这种方式判断下就可以了。
本人也是在边学边写,还是个渣渣,高玩勿喷