vue2实现一个简易实用的日历（可特殊标记多个日期）

最新推荐文章于 2025-02-19 15:03:02 发布

WebKoalaBoy

最新推荐文章于 2025-02-19 15:03:02 发布

阅读量698

点赞数 3

分类专栏： vue 文章标签：前端 javascript html

本文链接：https://blog.csdn.net/hongyu799/article/details/139752627

版权

效果如下：

<template>
    <div class="calendar">
      <div class="header">
        <button @click="previousMonth">&lt;</button>
        <h2>{
  { currentYear }}-{
  { currentMonth }} </h2>
        <button @click="nextMonth">&gt;</button>
      </div>
      <div class="days">
        <div v-for="day in daysOfWeek" :key="day" class="week">{
  { day }}</div>
        <div v-for="blank in firstDayOfMonth" :key=" 'black'+blank" class="day"></div>
        <div
          v-for="(date, index) in daysInMonth"
          :key="i