小程序实现日期上一天、下一天切换

635 阅读1分钟

js实现小程序日期切换(上一天、下一天)

data数据结构

data: {
    date: '今天',
    targetNum: 0,
    nextNum: 0
},

封装日期处理函数

showdate(n) { // 日期切换处理函数  返回时间格式 YYYY-MM-DD
    var date = new Date();
    date.setDate(date.getDate() + n);
    var month = date.getMonth() + 1
    month = month > 10 ? month : '0' + month // 格式化月份
    var day = date.getDate()
    day = day > 10 ? day : '0' + day // 格式化日期
    date = date.getFullYear() + "-" + month + "-" + day
    return date;
},

封装切换日期的函数

参数num:昨天 -1,前天-2 以此类推(比如5天前就是传-5) 明天 1,后天 2以此类推(比如5天后就是传5) 0 代表今天

gargetdata(num){ // 切换日期
    var that = this
    var date = this.showdate(num)
    date = date == this.showdate(0) ? '今天' : date
    date = date == this.showdate(-1) ? '昨天' : date
    date = date == this.showdate(1) ? '明天' : date
    that.setData({
        date: date,
        targetNum: num
    })
},

上一天按钮点击事件,触发一次num-1

upDate(){ // 上一天
    var that = this
    var num = that.data.targetNum - 1
    that.gargetdata(num)
},

下一天按钮点击事件,触发一次num+1

nextDate(){ // 下一天
    var that = this
    if (that.data.date == '今天')return
    var num = that.data.targetNum + 1
    that.gargetdata(num)
},

补充:时间差计算

getDays(timestr) {
    var rDate = {};
    var dateStrs = timestr.split("-")
    // 获得目标时间对象
    var finallyDate = new Date(parseInt(dateStrs[0], 10), (parseInt(dateStrs[1], 10) - 1), parseInt(dateStrs[2], 10) + 1);
    var NowDate = new Date();   // 获取当前时间
    var Dtime = finallyDate - NowDate;  // 计算时间差
    // 填充时间差对象
    rDate.days = Math.floor(Dtime / (24 * 3600 * 1000));
    return rDate;
},

如果对你有帮助,点个赞再走吧~谢谢

关注我,不定时分享技术干货~