element el-date-picker 日期组件置灰指定日期范围、禁止日期范围日期选择

JS如何将当前日期或指定日期转时间戳_javascript技巧_脚本之家

小于指定日期前的日期置灰

比如这里 指定日期是 2024-02-20 10:48:15

disabledDate(time) time是一个函数提供的时间用于比较 他是一个时间戳↓ 理解为我们想要置灰的时间

time.getTime() <= timeStamps- 1 * 24 * 60 * 60 * 1000 表示小于指定时间置灰

time.getTime() > Date.now() //表示大于当前日期(电脑时间) 置灰

 data() {
    return {
      pickerOptionsStart: {
        disabledDate: "",
      },
      pickerOptionsEnd: {
        disabledDate: "",
      },
    };
  },


let timeStamps1 = Date.parse('2024-02-20 10:48:15'); //转时间戳
that.disabledDateMethod(timeStamps1);

methods:{
    disabledDateMethod(timeStamps) {
      this.pickerOptionsStart = {
        disabledDate(time) {
          console.log(time,'time')
          return (
            time.getTime() <= timeStamps- 1 * 24 * 60 * 60 * 1000 ||
            time.getTime() > Date.now()
          );
        },
      };
    },
    //小于当前时间减14天的时候置灰
    disabledDateMethodMore14() {
      this.pickerOptionsStart = {
        disabledDate(time) {
          return (
            time.getTime() < Date.now() - 15 * 24 * 60 * 60 * 1000 ||
            time.getTime() > Date.now()
          );
        },
      };
    },
    
}
相关推荐
肥肠可耐的西西公主26 分钟前
前端(AJAX)学习笔记(CLASS 2):图书管理案例以及图片上传
前端·笔记·学习
大胖丫27 分钟前
vue 学习-vite api.js
开发语言·前端·javascript
孙桂月29 分钟前
ES6相关操作(2)
前端·javascript·es6
遇见很ok29 分钟前
js中 ES6 新特性详解
开发语言·javascript·es6
陈浩源同学29 分钟前
学习 TypeScript 栈和队列数据结构
前端·算法
天天开发29 分钟前
【零代码革命】用Trae打造Flutter应用:AI助力,小白秒变工程师-页面调教篇
前端
我这一生如履薄冰~31 分钟前
简单封装一个websocket构造函数
前端·javascript·websocket
fangcaojushi31 分钟前
解决webpack5.54打包图片及图标的问题
前端·vue.js
海盗强32 分钟前
Webpack打包优化
前端·webpack·node.js
星之卡比*33 分钟前
前端面试题---vite和webpack的区别
前端·面试