关于vue-lunar-full-calendar的使用说明_vue.js_

npm install --save vue-lunar-full-calendar

import LunarFullCalendar from "vue-lunar-full-calendar"; Vue.use(LunarFullCalendar);

data() { let self = this; return { events:[], config: { eventLimitText: '更多', lunarCalendar: true,//控制中文日历是否显示为真 locale:'zh-cn',//中文 eventColor: 'white', header: { left: 'prevYear,prev,next,nextYear', center: 'title', right: 'hide,custom, today' }, eventLimit: true, // 一天中显示多少条事件，多了隐藏 firstDay: 0, // 控制周一周日那个在前面 defaultView: 'month', buttonText: { today: '今天', month: '月', week: '周', day: '日' }, //分页方法 viewRender(view, element) { self.viewRender(view, element); }, customButtons: { // 新增按钮 hide: { text: '隐藏农历', click: function () { self.$refs.calendar.fireMethod('option', { lunarCalendar: false }) self.$refs.calendar.fireMethod('option', { header: { left: 'prevYear,prev,next,nextYear', center: 'title', right: 'show,custom, today' } }) } }, show: { text: '显示农历', click: function () { self.$refs.calendar.fireMethod('option', { lunarCalendar: true }) self.$refs.calendar.fireMethod('option', { header: { left: 'prevYear,prev,next,nextYear', center: 'title', right: 'hide,custom, today' } }) } }, }, }, } }

//如果没有点击事件需求 此处可省略 viewRender (view, element) { //获取要查询月份的时间戳 var time = view.calendar.currentDate._i; this.years=this.$moment(time).format('YYYYMM') //initDta为初始化方法 是根据页面需求 调用接口 查询调转日期的方法 this.initData(this.years) },

 //日历事件点击事件 eventClick (event, jsEvent, pos) { }, //背景点击事件 dayClick (date, jsEvent, view) { },

// 放在dependencies里即可 "fullcalendar": "^3.10.2",