效果图
代码实现
<view>
<view class="jian btn" data-id="1" onTap="dateChange"/>
<text onTap="callDatePick">{{dateText}}</text>
<view class="jia btn" data-id="0" onTap="dateChange"/>
</view>
data: {
timeList: [{ "name": '年', id: "yyyy" }, { "name": '月', id: "yyyy-MM" }, { "name": '日', id: "yyyy-MM-dd" }],
timeType: "yyyy",//选择的时间筛选格式
dateText: formatDate(new Date(), 'yyyy'),//显示页面上的时间
},
//时间选择切换
selsetTime(e) {
console.log(e.target.dataset.id, this.data.dateText, "选择了时间格式")
this.setData({
timeType: e.target.dataset.id,
dateText: formatDate(this.data.dateText, e.target.dataset.id)
})
},
// 修改时间
callDatePick() {
console.log(this.data.timeType)
dd.datePicker({
format: this.data.timeType,
currentDate: this.data.dateText,
}).then(res => {
console.log(res)
this.setData({
dateText: res.date
})
})
},
//时间增加or减去
dateChange(e) { //e.target.dataset.id=0 增加1 e.target.dataset.id=1 减去1
let type = this.data.timeType
let num = e.target.dataset.id == 0 ? 1 : -1
let date = new Date(this.data.dateText);
let dateVal = ""
if (type == "yyyy") { //当前年份增加或减去一年
dateVal = parseInt(this.data.dateText) + num +''
} else if (type == "yyyy-MM") { //当前月份增加或减去一个月
date.setMonth(date.getMonth() + num);
let m = date.getMonth() + 1
m = m >= 10 ? m : '0' + m;
dateVal = date.getFullYear() + '-' + m
} else { //当前天数增加或减去一天
date.setDate(date.getDate() + num);
let m = date.getMonth() + 1
m = m >= 10 ? m : '0' + m;
let d = date.getDate() >= 10 ? date.getDate() : '0' + date.getDate();
dateVal = date.getFullYear() + '-' + m + '-' + d
}
this.setData({
dateText: dateVal
})
},
//地区切换
selsetSite(e) {
console.log(e.target.dataset.id, "选择了地区")
this.setData({
siteType: e.target.dataset.id
})
},
增加减去会自动更改年和月