背景: 按照客户需求,需要在日历控件上添加农历和节气 ,但是element ui控件中无弄里控件只能引入外部js来完成该功能, 1.引入calendar.js 2.调用方法 显示农历 2.1
// 公历转农历
solarToLunar (slotDate, slotData) {
let solarDayArr = slotData.day.split('-')
let lunarDay = calendar.solar2lunar(solarDayArr[0], solarDayArr[1], solarDayArr[2])/* global calendar */
// 农历日期
let lunarMD = lunarDay.IMonthCn + lunarDay.IDayCn
if (lunarMD.includes('初一')) {
// 每月初一 显示当前月 如正月初一 显示"正月"
lunarMD = lunarMD.substr(0, 2)
} else {
// 每月初一以外 不显示当前月 如正月初十 显示"初十"
lunarMD = lunarMD.slice(2)
}
// 公历节日\农历节日\农历节气
let festAndTerm = []
festAndTerm.push(lunarDay.festival == null ? '' : ' ' + lunarDay.festival)
festAndTerm.push(lunarDay.lunarFestival == null ? '' : '' + lunarDay.lunarFestival)
festAndTerm.push(lunarDay.Term == null ? '' : '' + lunarDay.Term)
festAndTerm = festAndTerm.join('')
let result = ''
if (festAndTerm === '') {
result = lunarMD
} else {
result = festAndTerm
}
return result
},
前端 显示
休
班
{{ data.day.split('-').slice(2).join('-') }}
{{ solarToLunar(date, data) }}
|