要获取选中的日期,可以在点击日期时调用一个方法,将选中的日期保存起来。可以在点击日期时给日期元素绑定一个点击事件,然后在事件处理程序中调用一个方法来保存选中的日期。

在上面的代码中,点击日期时调用了allcalendar方法,可以在该方法中保存选中的日期。具体实现如下:

<el-calendar>
  <template #date-cell="{ data }">
    <p
      :class="data.isSelected ? 'is-selected' : ''"
      @click="selectDate(data)"
      id="allcalendar"
    >
      {{ data.day.split('-').slice(1).join('-') }}
      {{ data.isSelected ? '✔️' : '' }}
    </p>
  </template>
</el-calendar>

<script>
export default {
  methods: {
    selectDate(date) {
      // 保存选中的日期
      console.log(date.day);
    }
  }
}
</script>

selectDate方法中,可以使用date.day获取选中的日期。你可以根据需求对选中的日期进行进一步操作。

el-calendar template #date-cell= data p class=dataisSelected is-selected click=allcalendardata id=allcalendar datadaysplit-sl

原文地址: http://www.cveoy.top/t/topic/jdbu 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录