日期插件（自己写的）

<template>
  <div class="bg">
    <div class="dateTitle">
        <div>
            <div @click="proYear"><</div>
                <div class="ym">{{year}}</div>
            <div @click="nextYear">></div>
        </div>
        <div>
            <div @click="pro"><</div>
                <div class="ym">{{month > 9 ? month : '0' + month}}</div>
            <div @click="next">></div>
        </div>
    </div>
    <div class="title">
        <div>一</div>
        <div>二</div>
        <div>三</div>
        <div>四</div>
        <div>五</div>
        <div>六</div>
        <div>日</div>
    </div>
    <div class="box">
        <div @click="dateClick(item.main,i)" v-for="(item,i) in list" :class="{main:item.flag,today:item.today,}">{{item.main}}</div>
    </div>
    {{this.select}}
    <myDate :obj="calenderObj" v-on:calendarDate="next"></myDate>
  </div>
</template>

<script>
// @ is an alias to /src
import common from '../assets/js/common.js'
// import myDate from '../components/myDate.vue'
export default {
  name: 'home',
  components: {
    // myDate
  },
  data() {
    return {
        date:'',
        t:'',
        list:[],
        years:[],
        year:0,
        month:0,
        day:0,
        select:0,
        calenderObj:{
            calendarType:false,
        },
        calendarDate:new Date(),
    }
  },
  created() {
  },
  mounted() {
    this.date = new Date();
        this.year  = this.date.getFullYear();
      this.month  = this.date.getMonth()+1;
      this.day   = this.date.getDate();
    this.nowDay = common.formatDate(new Date(),'yyyy/MM/dd')
    this.showDay = this.nowDay
    this.get()
  },
  methods: {
    dateClick(d,i) {
        if (!this.list[i].flag) {
            return
        }
        this.list.forEach(item => {
            item.today = false;
        })
        this.list[i].today = true;
        d = d < 9 ? `0${d}` : d;
        let month = this.month < 9 ? `0${this.month}` : this.month;
        this.select = `${this.year}-${month}-${d}`;
    },
    proYear() {
        this.year--;
        this.get();
    },
    nextYear() {
        this.year++;
        this.get();
    },
    pro() {
        this.month--;
        if(this.month == 0) {
            this.year= this.year - 1;
            this.month = 12;
        }
        this.get();
    },
    next() {
        this.month++;
        if(this.month > 12) {
            this.year= parseInt(this.year+this.month/12)
            this.month = this.month%12
        }
        this.get();
    },
    get() {
        this.list=[]
          // 本月第一天是星期几
          let firstDayWeekday = new Date(`${this.year}/${this.month}/1`).getDay();
          firstDayWeekday = firstDayWeekday == 0 ? 7 : firstDayWeekday;
          let proMonthDays =0;
          if(this.month != 1){
            proMonthDays = new Date(this.year,this.month-1,0).getDate();
          }else {
            proMonthDays = new Date(this.year-1,12,0).getDate();
          }
            for(var i = 0;i<firstDayWeekday-1;i++){
            this.list.push({main:proMonthDays-i,flag:false,})
          }
          this.list.reverse()
          // 本月天数进数组
          let nowMonthDays = new Date(this.year,this.month,0).getDate();
          for(var i = 1;i<=nowMonthDays;i++){
            this.list.push({main:i,flag:true,today:new Date(this.nowDay).getTime() == new Date(`${this.year}/${this.month}/${i}`).getTime()})
          }
          // 本月最后一天是星期几
          var lastDayWeekday = new Date(`${this.year}/${this.month}/${nowMonthDays}`).getDay();
          lastDayWeekday = lastDayWeekday == 0 ? 7 : lastDayWeekday;
            for(var i = 1;i<=7-lastDayWeekday;i++){
            this.list.push({main:i,flag:false})
          }
    }
  }
}
</script>
<style lang="scss" scoped>
.dateTitle {
    font-size: 24px;
    display: flex;
    justify-content: space-around;
    &>div {
        display: flex;
        justify-content: space-around;
        .ym {
            padding: 0 10px;
        }
    }
}
.main {
    color:black !important;
}
.today {
    border-radius: 50%;
    background:red !important;
}
.title {
    display: flex;
    justify-content: space-around;
    flex-wrap:wrap;
    border-bottom: 1px solid #eee;
    div {
        width: 14%;
        font-size: 25px;
        text-align: center;
    }
}
.box {
    margin-top: 20px;
    display: flex;
    justify-content: space-between;
    flex-wrap:wrap;
    div {
        width: 14%;
        text-align: center;
        font-size: 25px;
        color:#666;
    }
}
</style>

这个是common.formatDate()

function formatDate(date, format) {
  var v = "";
  if (typeof date == "string" || typeof date != "object") {
    return;
  }
  var year  = date.getFullYear();
  var month  = date.getMonth()+1;
  var day   = date.getDate();
  var hour  = date.getHours();
  var minute = date.getMinutes();
  var second = date.getSeconds();
  var weekDay = date.getDay();
  var ms   = date.getMilliseconds();
  var weekDayString = "";

  if (weekDay == 1) {
    weekDayString = "星期一";
  } else if (weekDay == 2) {
    weekDayString = "星期二";
  } else if (weekDay == 3) {
    weekDayString = "星期三";
  } else if (weekDay == 4) {
    weekDayString = "星期四";
  } else if (weekDay == 5) {
    weekDayString = "星期五";
  } else if (weekDay == 6) {
    weekDayString = "星期六";
  } else if (weekDay == 7) {
    weekDayString = "星期日";
  }

  v = format;
  //Year
  v = v.replace(/yyyy/g, year);
  v = v.replace(/YYYY/g, year);
  v = v.replace(/yy/g, (year+"").substring(2,4));
  v = v.replace(/YY/g, (year+"").substring(2,4));

  //Month
  var monthStr = ("0"+month);
  v = v.replace(/MM/g, monthStr.substring(monthStr.length-2));

  //Day
  var dayStr = ("0"+day);
  v = v.replace(/dd/g, dayStr.substring(dayStr.length-2));

  //hour
  var hourStr = ("0"+hour);
  v = v.replace(/HH/g, hourStr.substring(hourStr.length-2));
  v = v.replace(/hh/g, hourStr.substring(hourStr.length-2));

  //minute
  var minuteStr = ("0"+minute);
  v = v.replace(/mm/g, minuteStr.substring(minuteStr.length-2));

  //Millisecond
  v = v.replace(/sss/g, ms);
  v = v.replace(/SSS/g, ms);

  //second
  var secondStr = ("0"+second);
  v = v.replace(/ss/g, secondStr.substring(secondStr.length-2));
  v = v.replace(/SS/g, secondStr.substring(secondStr.length-2));

  //weekDay
  v = v.replace(/E/g, weekDayString);
  return v;
  }