基础日历上下月份切换实现？

// 计算当月天数和第一天是星期几

calculateMonthData(): void {

  const date = new Date(this.currentYear, this.currentMonth - 1, 1);

  this.firstDayOfMonth = date.getDay() === 0 ? 7 : date.getDay(); // 将周日(0)转换为7

  this.daysInMonth = new Date(this.currentYear, this.currentMonth, 0).getDate();

}

Grid() {

  ForEach(this.generateGridArray(), (item: number) => {

    GridItem() {

      if (item >= this.firstDayOfMonth - 1 && item < this.firstDayOfMonth + this.daysInMonth - 1) {

        // 有效日期

        Text(`${item - this.firstDayOfMonth + 2}`)

          .fontSize(14)

          .textAlign(TextAlign.Center)

          .width('100%')

          .height(30)

      } else {

        // 空白占位

        Text('')

          .fontSize(14)

          .textAlign(TextAlign.Center)

          .width('100%')

          .height(30)

      }

    }

  })

}

.columnsTemplate('1fr 1fr 1fr 1fr 1fr 1fr 1fr')

.rowsTemplate('1fr 1fr 1fr 1fr 1fr 1fr')

// 生成42个数字的数组（6周×7天）

generateGridArray(): number[] {

  let arr: number[] = [];

  for (let i = 0; i < 42; i++) {

    arr.push(i);

  }

  return arr;

}

// 切换到上一个月

goToPreviousMonth(): void {

  if (this.currentMonth === 1) {

    this.currentYear--;

    this.currentMonth = 12;

  } else {

    this.currentMonth--;

  }

  this.calculateMonthData();

}



// 切换到下一个月

goToNextMonth(): void {

  if (this.currentMonth === 12) {

    this.currentYear++;

    this.currentMonth = 1;

  } else {

    this.currentMonth++;

  }

  this.calculateMonthData();

}

@Entry

@Component

struct CalendarSwitcherPage {

  @State currentYear: number = new Date().getFullYear();

  @State currentMonth: number = new Date().getMonth() + 1;

  @State daysInMonth: number = 31;

  @State firstDayOfMonth: number = 1;



  // ... 上述所有方法 ...



  build() {

    Column() {

      // 月份切换控件

      // 星期标题

      // 日期网格

    }

  }

}