微信小程序自定义组件—按季度筛选

// index.wxml
<picker range=”{{quarterNewList}}” value=”{{quarters}}”
range-key=”text”
mode=”multiSelector”
bindchange=”bindMultiPickerChange”
bindcolumnchange=”bindMultiPickerColumnChange”>
{{quarter ? quarter : ‘请选择季度’}}
</picker>

// index.js
data: {
quarterList: getQuarterData(2020, new Date().getFullYear()),
quarter: ”,
quarters: [0,0], // 选择后的index集合
quarterNewList: [[],[]] //数据集合
},
// 初始化数据
onLoad(options) {
var array = this.data.quarterNewList;
array[0] = this.data.quarterList;
array[1] = array[0][0].children;
this.setData({
quarterNewList: array
});
},

//点击确定选择结果
bindMultiPickerChange: function (e) {
var result = e.detail.value;
this.setData({
quarters: result,
quarter: this.data.quarterNewList[0][result[0]].text + this.data.quarterNewList[1][result[1]].text
})
},
//选择列变更时，下级数组变更
bindMultiPickerColumnChange: function (e) {
var column = e.detail.column;
var index = e.detail.value;
var array = this.data.quarterList;
if (column == 0) {
array[1] = array[column][index].children;
this.setData({
quarterNewList: array
});
}
},

/**
* 获取季度数据
* @param {string} startYear 开始年份
* @param {string} endYear 结束年份
* @returns {Array} [{text: ‘2022年’, id: 2022, children: [{text: ‘第一季度’, id: 1}]}]
*/
export function getQuarterData(startYear, endYear) {
let data = []
for (var i = 0; i < (endYear – startYear + 1); i++) {
var obj = {
text: startYear + i + ‘年’,
id: startYear + i,
}
let qlist = []
for (var j = 1; j < 5; j++) {
let objs = {}
if (new Date().getFullYear() == (startYear + i)) {
var month = new Date().getMonth() + 1;
var stage = Math.ceil(month / 3) + 1;
if (j == stage) {
objs.text = ` 第${j}季度`
objs.id = j
break
} else {
objs.text = ` 第${j}季度`
objs.id = j
}
} else {
objs.text = ` 第${j}季度`
objs.id = j
}
qlist.push(objs)
}
obj.children = qlist.sort(_sortBy(‘id’, true)) // 倒叙处理数据
data.push(obj)
}
return data.sort(_sortBy(‘id’, true)) //倒叙处理数据

}

/**
* 对象数组根据某一属性排序
* @param {string} field
* @param {boolean} rev true表示升序排列，false降序排序
* @returns {function}
*/
export function _sortBy (field, rev) {
if (rev === undefined) {
rev = 1;
} else {
rev = (rev) ? 1 : -1;
}
return function (a, b) {
let val1 = a[field] * 1;
let val2 = b[field] * 1;
if (val1 < val2) {
return rev * 1;
} else if (val1 > val2) {
return rev * -1;
}
}
}