电商 网站 备案谷歌外贸
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>