最近在做一个类似历史上的今天的项目，里面用到了一个时间选择器，但是官方的date picker并没有隐藏年份的方法，于是照着官方文档改了一下。
用到的是官方picker 的多列选择器：mode = multiSelector 本着开源精神就把代码po出来
具体实现如下：
在wxml中：
<view class="section">
<view class="section__title">多列选择器</view>
<picker mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnChange" value="{{multiIndex}}" range="{{multiArray}}">
<view class="picker">
当前选择：{{multiArray[0][multiIndex[0]]}}-{{multiArray[1][multiIndex[1]]}}
</view>
</picker>
</view>
在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天，照着这种方式判断下就可以了。
本人也是在边学边写，还是个渣渣，高玩勿喷
