element ui 的 el-date-picker 日期选择组件设置可选日期范围

news2024/11/24 22:41:24

有时候,在使用日历控件的时候,我们需要进行定制,控制用户只能在指定日期范围内进行日期选择,在这里,我使用了 element ui 的 el-date-picker 日期选择控件,控制只能选择当前月及往前的2个月,效果如图:

HTML代码: 

<template>
    <el-date-picker :picker-options="pickerOptions" type="month" placeholder="选择月" v-model="monthsVal"></el-date-picker>
</template>

JS代码: 

<script>
export default {
    data() {
        return {
            monthsVal:'',
            pickerOptions: {
                disabledDate(time) {
                    const currentMonth = new Date().getMonth();
                    const allowedMonths = [currentMonth, currentMonth - 1, currentMonth - 2];
                    return !allowedMonths.includes(time.getMonth());
                },
            },
        }
    },
}
</script>

CSS代码: 

<style>
.el-month-table td .cell{
    background-color:unset !important;
}
</style>

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

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

相关文章

基于单片机和组态王的温度监控系统的设计

摘 要 : 介绍了以 MSP430 单片机为核心 , 建立基于 DS18B20 和组态王的温度采集和监控系统。主要研究了单片机和组态王的通用通讯协议。按照 KingView 提供的通信协议 , 设计组态王与单片机的通信程序 , 实现了组态王与M SP430 单片机的直接串行通讯。在中药提取装置的…

优思学院|「按计划推动型」与「需求拉动型」的生产模式

针对生产架构做对比分类的用语&#xff0c;主要有按计划推进型与需求拉动型。 「按计划推动型」与「需求拉动型」两者乃是生产架构上常使用、成对比的两个用语。不过&#xff0c;有时不只用来指单纯的生产现场架构&#xff0c;也有人把它应用在更广泛的生产架构设计上。 按计划…

智能网络构建:探索大模型在网络领域的应用

网络领域以其高度复杂性和快速迭代为特点&#xff0c;完成从网络设计、配置、诊断到安全的网络任务需要广泛的专业知识。这些任务的固有复杂性&#xff0c;加上网络技术和协议不断变化的格局&#xff0c;为传统基于机器学习的方法带来了显著的障碍。这些方法在泛化和自动化网络…

吴恩达+ OpenAi共同编写<面向开发者的LLM入门教程>Github 50k+ star!

今天给大家推荐一本由吴恩达和OpenAI团队共同编写的关于大型语言模型&#xff08;LLM&#xff09;的权威教程<面向开发者的LLM入门教程>&#xff01;&#xff0c;在Github上已经高达50k star了&#xff0c;这含金量不用多说&#xff0c;在这里给大家强烈推荐一波&#xf…

孟德献刀 | 第4集 | 宁教我负天下人,休教天下人负我 | 你自比鸿鹄,安知他人是燕雀呀 | 三国演义 | 逐鹿群雄

&#x1f64b;大家好&#xff01;我是毛毛张! &#x1f308;个人首页&#xff1a; 神马都会亿点点的毛毛张 &#x1f4cc;这篇博客是毛毛张分享三国演义文学剧本中的经典台词和语句&#xff0c;本篇分享的是《三国演义》第Ⅰ部分《群雄逐鹿》的第4️⃣集《孟德献刀》&#x…

开源API网关-ApacheShenYu首次按照启动遇到的问题

一.背景 公司有API网关产品需求&#xff0c;希望有图形化的后台管理功能。看到了ApacheShenYu&#xff0c;作为Apache的顶级项目&#xff0c;直接认可了。首先&#xff0c;感谢各位大神的付出&#xff0c;初步看这个项目是国内大厂中的大神创立的&#xff0c;在此表示膜拜&…

如何利用俄罗斯VK Ads破解中俄贸易难题?

在当前全球经济环境下&#xff0c;中国与俄罗斯之间的贸易关系正面临着新的机遇和挑战。 特别是随着国际形势的变化&#xff0c;中俄两国的贸易往来日益频繁&#xff0c;中国企业机构出口至俄罗斯的业务也随之增多。 在这样的背景下&#xff0c;如何通过有效的市场推广策略&a…

【鸿蒙学习笔记】页面和自定义组件生命周期

官方文档&#xff1a;页面和自定义组件生命周期 目录标题 [Q&A] 都谁有生命周期&#xff1f; [Q&A] 什么是组件生命周期&#xff1f; [Q&A] 什么是组件&#xff1f;组件生命周期 [Q&A] 什么是页面生命周期&#xff1f; [Q&A] 什么是页面&#xff1f;页面生…

Python爬取中国天气网天气数据.

一、主题式网络爬虫设计方案 1.主题式网络爬虫名称 名称&#xff1a;Python爬取中国天气网天气数据 2.主题式网络爬虫爬取的内容与数据特征分析 本次爬虫主要爬取中国天气网天气数据 3.主题式网络爬虫设计方案概述&#xff08;包括实现思路与技术难点&#xff09; reques…

可以在Mac电脑玩的拳皇97 for Mac(KOF97) 支持M1

《拳皇97》&#xff08;The King of Fighters 97&#xff09;是一款由SNK公司制作的拳击格斗游戏&#xff0c;于1997年在Arcade平台发布&#xff0c;随后在多个游戏平台上推出。该游戏是《拳皇》系列的第三个作品&#xff0c;继承了前作《拳皇96》的“adius”系统&#xff0c;并…

Windows C盘清理指南:哪些文件可以删,哪些不能动?

文章目录 📖 介绍 📖🏡 演示环境 🏡📒 文章内容 📒📝 可删除的文件类型📝 不能删除的文件类型📝 使用第三方工具📝 注意事项⚓️ 相关链接 ⚓️📖 介绍 📖 对于普通电脑用户来说,最令人困扰的问题之一就是电脑C盘满了。不仅导致系统运行缓慢,而且如果…

重磅!免费一键批量混剪工具它来了,一天上万短视频不是梦

很多做短视频营销的朋友需要批量生成大量的短视频&#xff0c;但是市面上的工具一是不好用&#xff0c;二是要收费。 今天给大家介绍一款免费的&#xff0c;可以自动化批量生成短视频的工具MoneyPrinterPlus。 同时支持windows和linux平台。 有了它&#xff0c;一天生成上万短…

2024年Nano编辑器最新使用教程

Nano在大多数Linux发行版中找到&#xff0c;易于使用&#xff0c;其最常用的命令显示在其屏幕底部。 作为编辑配置和其他文件是Linux中的一种普遍的任务&#xff0c;知道如何使用该程序是否可以非常有用。Nano编辑器以及如何使用Nano编辑器在服务器上编辑文件是我们将在本指南中…

“一团乱麻”到底什么是烟雾病呢?

当我们听到“烟雾病”这个名字时&#xff0c;可能会联想到与吸烟有关的疾病&#xff0c;但实际上&#xff0c;这是一种与吸烟毫无关系的罕见脑血管疾病。它的名字来源于在脑血管造影中&#xff0c;病变的血管网看起来像一团乱麻&#xff0c;又似吸烟时吐出的烟雾。 烟雾病&…

Arduino - Keypad 键盘

Arduino - Keypad Arduino - Keypad The keypad is widely used in many devices such as door lock, ATM, calculator… 键盘广泛应用于门锁、ATM、计算器等多种设备中。 In this tutorial, we will learn: 在本教程中&#xff0c;我们将学习&#xff1a; How to use key…

WPF----自定义滚动条ScrollViewer

滚动条是项目当中经常用到的一个控件&#xff0c;大部分对外项目都有外观的需求&#xff0c;因此需要自定义&#xff0c;文中主要是针对一段动态的状态数据进行展示&#xff0c;并保证数据始终在最新一条&#xff0c;就是需要滚动条滚动到底部。 1&#xff0c;xaml中引入 <…

【微服务】Alibaba Cloud Linux环境下Docker以及MySQL安装

部署Docker 1.安装dnf dnf是新一代的rpm软件包管理器 yum -y install dnf2.安装社区版Docker&#xff08;docker-ce&#xff09; 添加docker-ce的dnf源 dnf config-manager --add-repohttps://mirrors.aliyun.com/docker-ce/linux/centos/docker-ce.repo安装Alibaba Cloud…

【03】从0到1构建AI生成思维导图应用 -- Agent 搭建

【03】从0到1构建AI生成思维导图应用 – Agent 搭建 大家好&#xff01;最近自己做了一个完全免费的AI生成思维导图的网站&#xff0c;支持下载&#xff0c;编辑和对接微信公众号&#xff0c;可以在这里体验&#xff1a;https://lt2mind.zeabur.app/ 上一章&#xff1a;https…

Arduino - TM1637 4 位 7 段显示器

Arduino - TM1637 4 位 7 段显示器 Arduino-TM1637 4 位 7 段显示器 A standard 4-digit 7-segment display is needed for clock, timer and counter projects, but it usually requires 12 connections. The TM1637 module makes it easier by only requiring 4 connectio…

【yolov8系列】ubuntu上yolov8的开启训练的简单记录

前言 yolov8的广泛使用&#xff0c;拉取yolov8源码工程&#xff0c;然后配置环境后直接运行&#xff0c;初步验证自己数据的检测效果&#xff0c;在数据集准备OK的情况下 需要信手拈来&#xff0c;以保证开发过程的高效进行。 本篇博客更注意为了方便自己使用时参考。顺便也记录…