vue elementui <el-date-picker>日期选择框限制只能选择90天内的日期(包括今天)

之前也写过其他限制日期的语句,感觉用dayjs()的subtract()和add()也挺方便易懂的,以此记录
安装dayjs npm install dayjs --save

javascript 复制代码
dayjs().add(value : Number, unit : String);
dayjs().add(7, 'day'); //在当前的基础上加7天
javascript 复制代码
dayjs().subtract(value : Number, unit : String);
dayjs().subtract(7, 'day'); //在当前基础上减少7天

案例使用:

javascript 复制代码
<template>
  <el-date-picker
    v-model="value1"
    type="date"
    placeholder="选择日期"
    :picker-options="pickerOptions">
  </el-date-picker>
</template>

<script>
import dayjs from 'dayjs'
  export default {
    data() {
      return {
        pickerOptions: {
          disabledDate(time) {
            return dayjs().subtract(1, 'day') >= time || time >= dayjs().add(89, 'day');
            // 这是可以限制可选择今天之后的三个月内的日期(不包括今天)
            // return  dayjs() >= time  ||  time >=  dayjs().add(3, 'month')
          }
        },
        value1: ''
      };
    }
  };
</script>
相关推荐
神秘的猪头20 小时前
ES6 字符串模板与现代 JavaScript 编程教学
前端·javascript
白兰地空瓶20 小时前
从 "拼接地狱" 到 "模板自由":JS 字符串的逆袭指南
javascript
ideaout技术团队20 小时前
android集成react native组件踩坑笔记(Activity局部展示RN的组件)
android·javascript·笔记·react native·react.js
kaikaile199520 小时前
如何使用React和Redux构建现代化Web应用程序
前端·react.js·前端框架
江城开朗的豌豆20 小时前
TS类型进阶:如何把对象“管”得服服帖帖
前端·javascript
Cache技术分享20 小时前
226. Java 集合 - Set接口 —— 拒绝重复元素的集合
前端·后端
前端小咸鱼一条20 小时前
13. React中为什么使用setState
前端·javascript·react.js
没有bug.的程序员20 小时前
Spring Boot Actuator 监控机制解析
java·前端·spring boot·spring·源码
包饭厅咸鱼20 小时前
autojs----2025淘宝淘金币跳一跳自动化
java·javascript·自动化
OpenTiny社区21 小时前
如何使用 TinyEditor 快速部署一个协同编辑器
前端·开源·编辑器·opentiny