vue-admin-element创建日历

日历组件

<el-calendar :range="['2019-03-04', '2019-03-24']">
          <!-- 这里使用的是 2.5 slot 语法，对于新项目请使用 2.6 slot 语法-->
          <template
            slot="dateCell"
            slot-scope="{date, data}">
            <div v-if="data.day.split('-').slice(1)[1] >= 10">
              {{ data.day.split('-').slice(1)[1] }}
            </div>
            <div v-if="data.day.split('-').slice(1)[1] < 10">
              {{ data.day.split('-').slice(1)[1].replace(/^0/, '') }}
            </div>
            <div class="" v-if="data.day.split('-').slice(1)[1] === '07'">
              今天是个好日子
            </div>
            <div class="" v-if="data.day.split('-').slice(1)[1] === '17'">
              今天天气不错
            </div>
          </template>
        </el-calendar>

注意：
1、设置 range 属性指定日历的显示范围。开始时间必须是周起始日，结束时间必须是周结束日，且时间跨度不能超过两个月。