HarmonyOS 鸿蒙Next 想实现点击日历上的元素，返回点击元素的年月日

HarmonyOS 鸿蒙Next 想实现点击日历上的元素，返回点击元素的年月日 我做了一个自定义组件，日历，但是在坐点击事件的时候蒙了，怎么解决点击之后获得对应元素的信息啊，还要更改样式

附上代码，可跑，使用api9

@Entry
@Component
export default struct CalendarItem {
  //定义当年当月当日
  @State currentYear: number = 2024
  @State currentMonth: number = 0
  @State currentDay: number = 0
  //日历第一天 为1：周日 为0： 周一
  //取得当月天数
  @State allDay: number[] = []
  //获取当月第一天是星期几
  @State currentFirstWeekDay: number = 1
  @State week: string[] = ['日', '一', '二', '三', '四', '五', '六']
  //存放上个月的天数
  @State preMonth: any[] = []
  //需要显示下月的天数
  @State nextMonth: any[] = []
  //当前
  @State currentText: string = ''

//获取上月天数
  getPrevMonthDay() {
    let date = new Date(this.currentYear, this.currentMonth - 1, 0); // 获取上月;
    let day = date.getDate(); // 因为Date函数中天设置的0，因此这里是上月最后一天的值
    let days = this.currentFirstWeekDay; // 上月要显示几天
    let weeks = [];
    while (days > 0) {
      weeks.push({
        year: date.getFullYear(),
        month: date.getMonth() + 1,
        day: day--,
      });
      days--;
    }
    return weeks.sort((a, b) => a.day - b.day); // 因为是从大到小的，排个序
  }

//获取下月天数
  getNextMonthDay(){
    let date = new Date(this.currentYear, this.currentMonth - 1, 0); // 获取上月;
    let day = date.getDate(); // 因为Date函数中天设置的0，因此这里是上月最后一天的值
    let days = this.currentFirstWeekDay; // 上月要显示几天
    let weeks = [];
    while (days > 0) {
      weeks.push({
        year: date.getFullYear(),
        month: date.getMonth() + 1,
        day: day--,
      });
      days--;
    }
    return weeks.sort((a, b) => a.day - b.day); // 因为是从大到小的，排个序
  }

  aboutToAppear() {
    let date = new Date();
    this.currentDay = date.getDate()
    this.currentMonth = date.getMonth() + 1;
    this.currentYear = date.getFullYear();
    this.currentFirstWeekDay = new Date(date.getFullYear(), date.getMonth(), 1).getDay();
    let allDay = new Date(date.getFullYear(), date.getMonth() + 1, 0).getDate();

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

      this.allDay[i] = i
    }
    this.preMonth = this.getPrevMonthDay()
  }
  refreshDays(month: number,year: number){
    //上月
    let date = new Date(year, month - 1, 0); // 获取上月;
    let day = date.getDate(); // 因为Date函数中天设置的0，因此这里是上月最后一天的值
    this.currentFirstWeekDay = new Date(year, month-1, 1).getDay();
    let days = this.currentFirstWeekDay; // 上月要显示几天
    let weeks = [];
    while (days > 0) {
      weeks.push({
        day: day--,
      });
      days--;
    }
    weeks.sort((a, b) => a.day - b.day); // 因为是从大到小的，排个序
    this.preMonth = weeks
    //本月
    console.info(`year${year}month${month}`)
    let allDay = new Date(year, month, 0).getDate();
    console.info(`allDay${allDay}`)
    //需要先重置
    this.allDay = []
    for (let i = 0;i < allDay; i++) {
      this.allDay[i] = i
    }
    console.info(`${this.allDay}`)
  }
  refreshDate(month: number) {
    if (month < 1) {
      this.currentMonth = 12
      this.currentYear--
      //重新更新天数
      this.refreshDays(this.currentMonth,this.currentYear)
    }
    else if (month > 12) {
      this.currentMonth = 1
      this.currentYear++

      this.refreshDays(this.currentMonth,this.currentYear)
    }
    else {
      this.currentMonth = month
      this.currentYear = this.currentYear;

      this.refreshDays(this.currentMonth,this.currentYear)
    }
  }

  @Builder Header() {
    Row() {
      Image($rawfile('icon_arrow_l.svg'))
        .width(15)
        .height(15)
        .margin({ right: 20 })
        .onClick(() => {
          this.currentMonth--
          this.refreshDate(this.currentMonth)
        })
      Text(`${this.currentYear}年${this.currentMonth}月`)
        .fontSize(20)
      Image($rawfile('icon_arrow_r.svg'))
        .width(15)
        .height(15)
        .margin({ left: 20 })
        .onClick(() => {
          this.currentMonth++

          this.refreshDate(this.currentMonth)
        })
    }
  }

  @Builder Week(value: string[]) {
    Column() {
      Grid() {
        ForEach(value, (data: string) => {
          GridItem() {
            Text(data)
              .fontSize(16)
              .fontWeight(FontWeight.Bold)
              .width('100%')
              .height('100%')
              .textAlign(TextAlign.Center)
          }
        })
      }
      .columnsTemplate('1fr 1fr 1fr 1fr 1fr 1fr 1fr')
      .columnsGap(10)
      .rowsGap(10)
      .width('90%')
      .height(50)
    }
    .width('100%')
    .margin({ bottom: 10 })
  }

  @Builder Day() {
    Grid() {
      ForEach(this.preMonth, (i) => {
        GridItem() {
          Text(String(i['day']))
            .textAlign(TextAlign.Center)
            .fontSize(16)
            .fontColor(Color.Gray)
        }
        .onClick(() => {
          this.currentMonth--
          console.info(`currentMonth${this.currentMonth}`)
          this.refreshDate(this.currentMonth)
        })
      })
      ForEach(this.allDay, (i) => {
        GridItem() {
            Text(String(i + 1))
              .fontSize(16)
              .fontColor('#ff2e5391')
              .textAlign(TextAlign.Center)
        }
      })
    }
    .columnsTemplate('1fr 1fr 1fr 1fr 1fr 1fr 1fr')
    .columnsGap(10)
    .rowsGap(10)
    .width('90%')
    .height('100%')
  }
  build() {
    Column() {
      this.Header()
      this.Week(this.week)
      this.Day()
    }
  }
}