建议收藏！整理了五款Vue日历开源组件~

# 安装
npm i vuejs-heatmap

yarn add vuejs-heatmap

# 使用

# 安装
npm i vue-functional-calendar

yarn add vue-functional-calendar

# 使用
// Introduced in vue file
import FunctionalCalendar from 'vue-functional-calendar';
Vue.use(FunctionalCalendar, {
    dayNames: ['Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa', 'Su']
});

# 安装
npm i dayspan-vuetify

yarn add dayspan-vuetify

# 使用
import DaySpanVuetify from 'dayspan-vuetify'

Vue.use( DaySpanVuetify, {
  // options is vue definition, the resulting reactive component is stored in components as this.$dayspan or Vue.$dayspan
  data: {
    // data or computed to override
  },
  computed: {
    // data or computed to override
  },
  methods: {
    // methods to override
  }
});

# 安装
npm i v-calendar

yarn add v-calendar

# 全局引入并注册所有组件
import VCalendar from 'v-calendar';
Vue.use(VCalendar, {
  componentPrefix: 'vc',  //使用 in代替 
  ...,                // 其他设置
});

# 引入独立组件
import Calendar from 'v-calendar/lib/components/calendar.umd'
import DatePicker from 'v-calendar/lib/components/date-picker.umd'




// 全局注册
Vue.component('calendar', Calendar)
Vue.component('date-picker', DatePicker)

//或者在独立组件中注册
export default {
  components: {
    Calendar,
    DatePicker
  }
  ...
}

# 安装
npm i kalendar-vue portal-vue -S

# 全局引入
import Vue from "vue";
import PortalVue from "portal-vue";
Vue.use(PortalVue);

# 组件中使用
import { Kalendar } from 'kalendar-vue';
...
components: {
    Kalendar,
    ...
},