Vue2中Date对象使用异常：getMonth+1报错、四月显示31天

我来帮你逐一梳理并解决这几个问题，让日历正常工作：

1. this.currentMonth = mydate.getMonth()+1; 报错的问题 #

你遇到的报错本质是数据更新和模板判断逻辑不同步导致的连锁问题。

原来的代码里，currentMonth存储的是getMonth()返回的0-11月份值，模板用dayobject.mydate.getMonth()+1 != currentMonth判断是否为其他月份；当你把currentMonth改成getMonth()+1（1-12的数值）后，模板的判断逻辑其实是对的，但报错根源不在这——而是你创建日历日期的方式错误（这也是第二个问题的核心原因），导致dayobject.mydate的月份逻辑混乱，进而触发模板报错。我们先修复日期创建逻辑，这个问题会跟着解决。

2. 四月显示31天的问题 #

这个问题的核心是错误的日期对象创建方式。看你循环里的代码：

var thisday=new Date();
thisday.setDate(mydate.getDate()+i);

new Date()会创建一个当前系统日期的对象，比如现在是5月，thisday默认是5月的某一天，调用setDate()时，如果传入的日期超过当前月份的天数（比如四月只有30天，但你传入31），Date对象会自动跳到下一个月的第一天，但你的代码没有同步更新月份和年份，导致逻辑混乱，出现四月显示31天的错误。

正确的做法是基于mydate的时间戳来创建每一天的日期，自动处理月份和年份的切换：

for (i=0; i <35; i++) {
  // 基于mydate的时间戳，累加i天的毫秒数
  var thisday = new Date(mydate.getTime() + i * 24 * 60 * 60 * 1000);
  dayobject={ 'mydate': thisday };
  this.days.push(dayobject);
}

3. 修正strday的代码问题 #

你怀疑的这段代码：

strday=now.getFullYear()+-+(now.getMonth()+1)+-+1;

这里的+-+是语法错误，属于字符串拼接的写法失误。正确的写法有两种：

• 传统字符串拼接：

  strday = now.getFullYear() + '-' + (now.getMonth()+1) + '-1';
  

• ES6模板字符串（更简洁直观）：

  strday = `${now.getFullYear()}-${now.getMonth()+1}-1`;
  

完整修正后的核心代码 #

整合所有修复后的initData方法：

initData: function(cur) {
  var mydate;
  if (cur) {
    mydate = new Date(cur);
  } else {
    var now = new Date();
    mydate = new Date(now.getFullYear(), now.getMonth());
  };

  // 现在可以安全地设置currentMonth为1-12的数值了
  this.currentDay = mydate.getDate();
  this.currentYear = mydate.getFullYear();
  this.currentMonth = mydate.getMonth() + 1; 

  // 调整日历起始日期的逻辑保持不变
  if(mydate.getDay() == 0) {
    mydate.setDate(mydate.getDate() - 6);
  } else {
    mydate.setDate(mydate.getDate() - mydate.getDay() + 1);
  };

  this.days = [];
  for (i=0; i <35; i++) {
    // 修复后的日期创建逻辑
    var thisday = new Date(mydate.getTime() + i * 24 * 60 * 60 * 1000);
    dayobject = { 'mydate': thisday };
    this.days.push(dayobject);
  };
},

模板里的判断条件无需修改，现在currentMonth是1-12的数值，和dayobject.mydate.getMonth()+1的取值范围一致，对比逻辑完全正确。

额外小优化 #

• 模板里多次创建new Date()会浪费性能，建议在initData里把当前日期存到data中，比如today: new Date()，然后模板里用today判断当天；
• 拼写小错误：Saterday应该改成Saturday。

内容的提问来源于stack exchange，提问作者zephyr.mao