antd-vue - - - - - a-date-picker限制选择范围

antd-vue - - - - - a-date-picker限制选择范围

1. 效果展示

如图:限制选择范围为 今年 & 去年月份.
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

2. 代码展示

<template>
  <a-date-picker
    :disabledDate="disabledDate"
    picker="month"
  />
</template>

<script>
export default {
  methods: {
  
    disabledDate(current) {
    
      // 获取当前日期数据
      const now = new Date(); 
      
      // 创建一个新的 Date 对象,表示当前年份的第一天(1月1日)。
      // 注意,JavaScript 的月份是从0开始计数的,所以0表示1月
      const startOfYear = new Date(now.getFullYear(), 0, 1); 
      
      
      //创建一个新的 Date 对象,表示去年的第一天(1月1日)。
      const startOfLastYear = new Date(now.getFullYear() - 1, 0, 1);

      // 创建一个新的 Date 对象,表示当前年份的最后一天(12月31日)。
      const endOfYear = new Date(now.getFullYear(), 11, 31);

	  // 这里使用了逻辑运算符。
	  // 当 current 存在且它小于去年的第一天或者大于今年的最后一天时,返回 true,这意味着这个日期会被禁用。
	  // 否则返回 false,即允许选择这个日期。
      return current && (current < startOfLastYear || current > endOfYear);
    }
  }
};
</script>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值