当前位置: 首页 > news >正文

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

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

  • 1. 效果展示
  • 2. 代码展示

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>
http://www.lryc.cn/news/514537.html

相关文章:

  • 计算机网络练习题
  • redis的集群模式与ELK基础
  • STM32-笔记18-呼吸灯
  • Vue3 + ElementPlus动态合并数据相同的单元格(超级详细版)
  • 【JavaWeb后端学习笔记】MySQL的数据控制语言(Data Control Language,DCL)
  • libvirt学习
  • STM32-笔记19-串口打印功能
  • 概率论与数理统计
  • 统信系统设置代理的问题
  • TCP 为什么采用三次握手和四次挥手以及 TCP 和 UDP 的区别
  • springboot配置并使用RestTemplate
  • 人工智能-Python网络编程-TCP
  • 【Java回顾】Day3 继承|Override/Ovverload|多态|抽象类|封装|接口|枚举
  • SpringMVC(四)响应
  • vim 的基础使用
  • 关于flinkCDC监控mysql binlog时,datetime类型自动转换成时间戳类型问题
  • 基于Springboot校园失物招领系统【附源码】
  • 单片机端口操作和独立引脚操作
  • 【Vim Masterclass 笔记03】S03L10 + S03L11:Vim 中的文本删除操作以及 Vim 思维习惯的培养(含 DIY 拓展知识点)
  • ARM200~500部署
  • word中插入zotero引用
  • 需求上线,为什么要刷缓存?
  • TVS二极管选型【EMC】
  • 《从入门到精通:蓝桥杯编程大赛知识点全攻略》(一)-递归实现指数型枚举、递归实现排列型枚举
  • C#对线程同步的应用
  • 基于微信小程序的面部动作检测系统
  • Activation Functions
  • 《Vue3实战教程》37:Vue3生产部署
  • Linux:各发行版及其包管理工具
  • 【计算机网络】课程 作业一 搭建连续覆盖的办公网络