Vue カスタム オプション時間カレンダー コンポーネント

<div class="dateContent-body-day" v-for="item in 42" :key="item">
            <div
              v-if="item - beginDay > 0 && item - beginDay <= nowMdays"
              :class="{
                'active-day': `${year}/${month}/${item - beginDay}` == curDate
              }"
              @click="dayHandler"
              :data-year="年"
              :data-month="月"
              :data-day="アイテム開始日"
              :data-dates="年 + '/' + 月 + '/' + (項目 - 開始日)"
            >
              {{ アイテム開始日 }}
            </div>
            <div class="other-day" v-else-if="item - beginDay <= 0">
              {{ item - beginDay + prevMdays }}
    </div>
  <div class="other-day" v-else>{{ item - beginDay - nowMdays }}</div>
</div>

//クリックして日を切り替える dayHandler(e) {
      コンソールログ(e);
      var daNum = e.target.dataset;
      (this.cantTime.indexOf(daNum.dates) > -1) の場合 {
        this.$toast("オープン日ではないため、選択できません");
        戻る;
      }
      もし （
        `${daNum.年}/${daNum.月}/${daNum.日}` >=
        `${新しい日付().getFullYear()}/${新しい日付().getMonth() +
          1}/${新しい日付().getDate()}`
      ）{
        ターゲットデータセットの日付。
        これを$emit(
          「日付を選択」、
          this.year + "/" + this.month + "/" + this.date
        );
      } それ以外 {
        this.$toast("過去の時間は選択できません");
      }
    },
    //次の月に切り替える``nextMonth() {
      (今月 == 12) の場合 {
        this.month = 1;
        this.year++;
      } それ以外 {
        this.month++;
      }
},

```javascript
時計：
    日付(val, oldval) {
      if (値) {
        this.curDate = `${this.year}/${this.month}/${this.date}`;
      }
    },
    月(val, oldval) {
      if (値) {
        var 日付;
        (var i = 1; i <= 31; i++) の場合 {
          console.log(`${this.year}/${this.month}/${i}`);
          (this.cantTime.indexOf(`${this.year}/${this.month}/${i}`) < 0) の場合 {
            console.log("値が存在しません。停止してください。日付は " + i のままです);
            日付 = i;
            壊す;
          }
        }
        console.log(ndate, `${this.year}/${this.month}/${ndate}`);
        //現在の月と現在の日を比較します。将来の月のデフォルトは1で、現在の月のデフォルトは今日です（
          `${this.year}/${this.month}/1` >
          `${新しい日付().getFullYear()}/${新しい日付().getMonth() +
            1}/${新しい日付().getDate()}`
        ）{
          this.curDate = `${this.year}/${this.month}/${ndate}`;
          this.date = ndate;
        } それ以外 {
          (var i = new Date().getDate(); i <= 31; i++) {
            console.log(2`${this.year}/${this.month}/${i}`);
            (this.cantTime.indexOf(`${this.year}/${this.month}/${i}`) < 0) の場合 {
              this.curDate = `${新しい日付().getFullYear()}/${新しい日付().getMonth() +
            1}/${i}`;
          this.date = i;
              壊す;
            }
          }
        }
        これを$emit(
          「日付を選択」、
          this.year + "/" + this.month + "/" + this.date
        );
      }
    }
  },

<calendar :timeArray="timeArray" @chooseDate="chooseHandler"></calendar>
'@/components/index.js' から {calendar,alertBox} をインポートします。
エクスポートデフォルト{
    コンポーネント:{カレンダー、アラートボックス
    },