vxe-input vue 日期选择组件带农历节日、小圆点提醒

vxe-table vxe-input vue 日期选择组件带农历节日、小圆点提醒
默认的日期选择是没有节日信息的
在这里插入图片描述
可以通过 festival-method 方法自定义节日信息,接收一个对象,用于渲染当前的事件,例如:

{
	// ...
	methods: {
		// ...
		festivalMethod ({ date }) {
			const dateMaps = {
				20200801: {
					important: true, // 是否标记为重要节日
					label: '建军节', // 显示节日名称
					extra: {
						label: '休' // 右上角额外显示的事件名称
					}
				},
				20200812: {
					notice: true // 显示小圆点事件通知
				},
				20201001: {
					important: true,
					label: '国庆节,中秋节', // 如果同一天拥有多个节日重叠,用逗号分开
					extra: {
						important: true, // 是否标记为重要事件
						label: '班'
					}
				}
			}
			const ymd = XEUtils.toDateString(date, 'yyyyMMdd')
			return dateMaps[ymd] || { label: '无' }
		}
	}
}

在这里插入图片描述

在这里插入图片描述
在这里插入图片描述

  • 2
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 1
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值