el-date-picker自定义只能选中当前月份和半年内月份等

需求:el-date-picker只能选中当前月期和当前月期往前半年,其他时间就禁用了不让选择了,因为没数据哈哈。当然也可以选择往前一年等。

一、效果

 二、写个日期选择器

 :picker-options:日期选项

 value-format:选择后的格式

 @change:事件改变后触发的函数

<el-date-pickertype="months"v-model="monthTimeData"placeholder="选择一个或多个日期":picker-options="pickerOptions"value-format="yyyyMM"@change="monthTime"></el-date-picker>

三、data的值

      monthTimeData: [], // 绑定的日期值currentDate: new Date(), // 当前时间

四、computed

      this.currentDate.getMonth() - 4:注意!!!这个-4,就是当前月往前可选的几个月,

        -6就是不算上当前月往前可以选6个月,实在不懂可以自己测一下很简单的~

@change时间就是个函数,值就是选择后的值,这边我就不写了

  computed: {pickerOptions() {const startMonth = new Date(this.currentDate.getFullYear(),this.currentDate.getMonth() - 4);const endMonth = this.currentDate;return {disabledDate(time) {return time < startMonth || time > endMonth;},};},},

文章到此结束,希望对你有所帮助~

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/68171.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

设计模式-工厂模式Factory

工厂模式 b.工厂方法模式 (Factory Method) (重点)1) 简单工厂 Simple Factory1.a) 简单工厂的好处 2) 工厂方法 Factory Method2.a) 对工厂进行抽象化 (版本一)2.b) 对工厂进行缓存 (版本二)2.c) 加载配置文件到缓存中 (版本三)c.1) 产品线 c.抽象工厂模式 (Abstract Factory)…

C++ 嵌套循环

一个循环内可以嵌套另一个循环。C 允许至少 256 个嵌套层次。 语法 C 中 嵌套 for 循环 语句的语法&#xff1a; for ( init; condition; increment ) {for ( init; condition; increment ){statement(s);}statement(s); // 可以放置更多的语句 }C 中 嵌套 while 循环 语句的…

漏洞挖掘-利用

目录 一、文章简介 二、Web漏洞 1.SQL注入 &#xff08;1&#xff09;定义 &#xff08;2&#xff09;利用 &#xff08;3&#xff09;碰到的问题 &#xff08;4&#xff09;防御 &#xff08;5&#xff09;注入思路 &#xff08;6&#xff09;危害 2.任意文件读取 &…

SQL-DQL

-----分组查询----- 1.语法&#xff1a; SELECT 字段列表 FROM 表名 [WHERE 条件 ] GROUP BY 分组字段名 [HAVING 分组后过滤条件]&#xff1b; 2.where与having区别 》执行时机不同&#xff1a;where是分组之前进行过滤&#xff0c;不满足where条件&#xff0c;不参与分组&…

C++ 接口(抽象类)

C 接口是使用抽象类来实现的&#xff0c;接口描述了类的行为和功能&#xff0c;而不需要完成类的特定实现。且抽象类与数据抽象互不混淆&#xff0c; 如果类中至少有一个函数被声明为纯虚函数&#xff0c;则这个类就是抽象类&#xff0c;数据抽象则是一个把实现细节与相关的接口…

【Flutter】Flutter 使用 qr_flutter 实现QR码二维码生成与渲染

【Flutter】Flutter 使用 qr_flutter 实现QR码二维码生成与渲染 文章目录 一、前言二、qr_flutter 包简介三、安装与配置四、基本使用五、高级功能与自定义六、完整实际业务代码示例七、总结 一、前言 亲爱的 Flutter 初学者&#xff0c;你好&#xff01;今天我要与你分享一个…

【黑马头条之项目部署_持续集成Jenkins】

本笔记内容为黑马头条项目的项目部署_持续集成部分 目录 一、内容介绍 1、什么是持续集成 2、持续集成的好处 3、今日内容 二、软件开发模式 1、软件开发生命周期 2、软件开发瀑布模型 3、软件的敏捷开发 三、Jenkins安装配置 1、Jenkins介绍 2、Jenkins环境搭建 …

OJ题库:计算日期到天数转换、打印从1到最大的n位数 、尼科彻斯定理

前言&#xff1a;在部分大厂笔试时经常会使用OJ题目&#xff0c;这里对《华为机试》和《剑指offer》中的部分题目进行思路分析和讲解&#xff0c;希望对各位读者有所帮助。 题目来自牛客网&#xff0c;欢迎各位积极挑战&#xff1a; HJ73:计算日期到天数转换_牛客网 JZ17:打印…

Python Number(数字).............................................

Python Number 数据类型用于存储数值。 数据类型是不允许改变的,这就意味着如果改变 Number 数据类型的值&#xff0c;将重新分配内存空间。 以下实例在变量赋值时 Number 对象将被创建&#xff1a; var1 1 var2 10您也可以使用del语句删除一些 Number 对象引用。 del语句…

CSAPP lab1 Data Lab

CSAPP lab1-Data Lab 前言&#xff1a; 本系列文章用于记录开始学习csapp的过程&#xff0c;奈何感觉自己基础实在太渣渣&#xff0c;系统好好学习一下这本神书以及其对应的lab lab 这一张的lab是真的干&#xff0c;好几道题卡的我脑壳都卡秃噜了&#xff0c;好歹终于凭借着…

【【STM32-29正点原子版本串口发送传输实验】

STM32-29正点原子版本串口发送传输实验 通过串口接收或发送一个字符 例程目的 开发板上我们接入的是实现异步通信的UART接口 USB转串口原理图 我们一步步分析 PA9是串口1 的发送引脚 PA10是串口1 的接受引脚 。因为我们现在只是用到异步收发器功能&#xff0c;所以我们现…

qt中子窗口最小化后再恢复显示窗口区域显示为全白色

问题&#xff1a; qt中子窗口最小化后再恢复显示窗口区域显示为全白色&#xff0c;如下图&#xff1a; 原因&#xff1a; 恢复显示后窗口为及时刷新。 解决办法&#xff1a; 重写showEvent函数&#xff0c;如下&#xff1a; void MyClass::showEvent(QShowEvent *event) {se…

大模型 Dalle2 学习三部曲(二)clip学习

clip论文比较长48页&#xff0c;但是clip模型本身又比较简单&#xff0c;效果又奇好&#xff0c;正所谓大道至简&#xff0c;我们来学习一下clip论文中的一些技巧&#xff0c;可以让我们快速加深对clip模型的理解&#xff0c;以及大模型对推荐带来革命性的变化。 clip结构 首选…

Mybatis 动态SQL – 使用choose标签动态生成条件语句

之前我们介绍了if,where标签的使用&#xff1b;本篇我们需要在if,where标签的基础上介绍如何使用Mybatis提供的choose标签动态生成条件语句。 如果您对if,where标签动态生成条件语句不太了解&#xff0c;建议您先进行了解后再阅读本篇&#xff0c;可以参考&#xff1a; Mybat…

CSS中如何实现文字描边效果(Text Stroke)?

聚沙成塔每天进步一点点 ⭐ 专栏简介⭐ 文字描边效果&#xff08;Text Stroke&#xff09;⭐ 示例⭐ 写在最后 ⭐ 专栏简介 前端入门之旅&#xff1a;探索Web开发的奇妙世界 记得点击上方或者右侧链接订阅本专栏哦 几何带你启航前端之旅 欢迎来到前端入门之旅&#xff01;这个…

Linux C语言 UDP协议实现的网络聊天室

需求分析 网络协议&#xff1a;UDP服务器需求&#xff1a; 需要一个存放用户数据的容器 因为是UDP协议&#xff0c;固采用链表的方式存储 服务器需要区分用户的操作类型&#xff08;如&#xff1a;上线&#xff0c;下线&#xff0c;发送消息&#xff09; 需要解析消息协议区分…

Navicat连接postgresql时出现‘datlastsysoid does not exist‘报错

当使用 Navicat 连接 PostgreSQL 数据库时出现 ‘datlastsysoid does not exist’ 的错误报错&#xff0c;这可能是由于 Navicat 版本与 PostgreSQL 版本不兼容所致。 这是因为在较新的 PostgreSQL 版本中移除了 ‘datlastsysoid’ 列&#xff0c;但可能较旧版本的 Navicat 尚…

Go实现LogCollect:海量日志收集系统【上篇——LogAgent实现】

Go实现LogCollect&#xff1a;海量日志收集系统【上篇——LogAgent实现】 下篇&#xff1a;Go实现LogCollect&#xff1a;海量日志收集系统【下篇——开发LogTransfer】 项目架构图&#xff1a; 0 项目背景与方案选择 背景 当公司发展的越来越大&#xff0c;业务越来越复杂…

Mysql底层数据结构为什么选择B+树

索引底层采用什么数据结构&#xff0c;为什么使用B树而不是其他数据结构&#xff1a; &#xff08;1&#xff09;如果采用二叉树&#xff1a;使用递增字段作为索引时&#xff0c;二叉树会退化成链表&#xff0c;查找效率太低 &#xff08;2&#xff09;如果采用红黑树&#xf…

微信小程序开发:一种新型的移动应用程序开发方式

一、引言 随着移动互联网的快速发展&#xff0c;微信小程序作为一种新型的移动应用开发方式&#xff0c;正在受到越来越多的关注。微信小程序是一种基于微信平台的轻量化应用&#xff0c;开发者可以通过微信提供的开发工具和接口&#xff0c;开发出各种具有特定功能的应用程序…