vant-weapp没有年份的组件,所以需要自己组装
<!-- 选择年份弹出框 -->
<van-popup show="{
{ showYear }}" position="bottom" custom-style="height: 40%;" bind:close="onClose">
<van-picker columns="{
{ columns }}" default-index="{
{ currentIndex }}" bind:change="onChange" show-toolbar title="选择年份" bind:cancel="onCancel" bind:confirm="onConfirm" />
</van-popup>
{
"navigationBarTitleText": "历史账单",
"navigationBarTextStyle": "black",
"usingComponents": {
"van-popup": "@vant/weapp/popup/index",
"van-datetime-picker": "@vant/weapp/datetime-picker/index",
"van-picker": "@vant/weapp/picker/index"
}
}
// pages/common/customer-manage/history-bill/index.js
Page({
/**
* 页面的初始数据
*/
data: {
showYear: false,
// 选择时间的年份
columns: [],
currentDate: new Date().getTime(),
// 默认当前年份
currentIndex: new Date().getFullYear() - (new Date().getFullYear() - 25),
currentName: new Date().getFullYear() + "年"
},
/**
* 生命周期函数--监听页面加载
*/
async onLoad(options) {
let that = this;
// 调用年份的操作
that.makeYear()
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage() {
},
//--------自定义方法----------
// 选择年份的区域，弹出弹窗框
chooseYear() {
this.setData({
showYear: true
})
},
// 弹出框确认事件
onConfirm(e) {
console.log(e, 1111)
this.setData({
showYear: false,
currentName: e.detail.value + "年",
"historyBillParam.year": e.detail.value
})
this.quotaHistoryBill(this.data.historyBillParam);
},
// 取消选择年份的弹框
onCancel() {
let that = this;
that.setData({
showYear: false
})
},
// 对选择时间进行单独的处理
makeYear() {
let year = []
let currentDate = new Date()
console.log(currentDate.getFullYear())
for (let j = currentDate.getFullYear() - 25; j < currentDate.getFullYear(); j++) {
year.push(j)
}
for (let i = currentDate.getFullYear(); i <= currentDate.getFullYear() + 25; i++) {
year.push(i)
}
this.setData({
columns: year,
})
},
})