简单实现小程序切换上下月

最新推荐文章于 2024-06-08 16:33:38 发布

huang_jimei

最新推荐文章于 2024-06-08 16:33:38 发布

阅读量224

点赞数

文章标签：小程序 javascript 前端

本文链接：https://blog.csdn.net/huang_jimei/article/details/130615739

版权

一、实现小程序切换上下月
在这里插入图片描述

1、wxml

    <view class="week_tops">
      <image src="../images/pre.png" class="icon1" bindtap="preMonth"/>
      {{cyear}}年{{cmonth}}月
      <image src="../images/next.png" class="icon1" bindtap="nextMonth"/>
    </view>

2、js

 data: {
    cyear:'',//当前年
    cmonth:'',//当前月
  },
 // 上一个月
  preMonth(){
    var that=this;
    if(that.data.cmonth<2){
      that.setData({
        cyear:that.data.cyear*1-1,
        cmonth:12
      })
    }else{
      var months=that.data.cmonth*1-1
      that.setData({
        cmonth:months<10?'0'+months:months
      })
    }
  },
  // 下一个月
  nextMonth(){
    var that=this;
    if(that.data.cmonth>11){
      that.setData({
        cyear:that.data.cyear*1+1,
        cmonth:'01'
      })
    }else{
      var months=that.data.cmonth*1+1
      that.setData({
        cmonth:months<10?'0'+months:months
      })
    }
  },
   onShow() {
     var that=this;
     var year=new Date().getFullYear();
     var month=new Date().getMonth()+1;
     that.setData({
       cyear:year,
       cmonth:month<10?'0'+month:month
     })
     console.log('dates~~~~~~~~~',year,month);
  },