vue日历组件

<template>
  <div class="calendar">
    <div class="top">
      <p>
        <span @click="reduceYear"><<</span>
        <span @click="reduceMonth"><</span>
      </p>
      <p>{
  {year}}年{
  {conversion(month)}}月</p>
      <p>
        <span @click="addMonth">></span>
        <span @click="addYear">>></span>
      </p>
    </div>
    <ul class="week">
      <li v-for="(item,index) in weekList" :key="index">{
  {item}}</li>
    </ul>
    <ul>
      <li class="lastMonth" v-for="(item,index) in lastMonthDays" :key="index+31">
        <p>{
  {item}}</p>
        <p>{
  {month-1>0?toLunar(year, month-1, item):toLunar(year-1, 12, item)}}</p>
      </li>
      <li
        class="nowMonth"
        :class="{mark:item===markDay}"
        v-for="(item,index) in nowMonthDays"
        :key="index+62"
        @click="changeDay(item)"
      >
        <p>{
  {item}}</p>
        <p>{
  {toLunar(year, month, item)}}</p>
      </li>
      <li class="nextMonth" v-for="(item,index) in nextMonthDays" :key="index">
        <p>{
  {item}}</p>
        <p>{
  {toLunar(year, month+1, item)}}</p>
      </li>
    </ul>
  </div>
</template>
<script>
export default {
  data() {
    return {
      year: null,
      month: null,
      day: null,
      markDay: null,
      weekList: ["日", "一", "二", "三", "四", "五", "六"],
      lastMonthDays: [],
      nowMonthDays: [],