vue el-date-picker中datetime类型对今天之后的日期包含时分禁用

vue el-date-picker中datetime类型对今天之后的日期包含时分禁用

在这里插入图片描述

目前对选择秒那一列未禁用


<template><div><el-date-pickerv-model="deactivateTime"type="datetime"format="yyyy-MM-dd HH:mm:ss"value-format="yyyy-MM-dd HH:mm:ss"placeholder="请选择时间":picker-options="pickerOptions"></el-date-picker></div></template><script>
export default {watch: {deactivateTime:{handler(newValue,oldValue){if(newValue == oldValue) {return;}this.selectableRange = this.timeRange(newValue);},immediate: true}},data () {return {deactivateTime: '',selectableRange: []};},computed: {pickerOptions() {return {disabledDate(time) {return time.getTime() > Date.now()},selectableRange: this.selectableRange,}}},mounted () { },methods: {initDateTime (date) {var dt = new Date(date)var h = dt.getHours() //获取时var m = dt.getMinutes() //获取分var s = dt.getSeconds() //获取秒if (h < 10) {h = '0' + h}if (m < 10) {m = '0' + m}if (s < 10) {s = '0' + s}return  h + ':' + m + ':' + s},timeRange(val) {if(val) {return new Date(val).getTime() < new Date().getTime() ? ['00:00:00 - 23:59:59'] : [`00:00:00 - ${this.initDateTime(new Date())}`]} else {return ['00:00:00 - 23:59:59']}},},
};
</script>

需要注意: el-date-picker的selectable-range属性不支持秒级的选择范围。该属性只能用于限制年、月、日、小时和分钟的选择范围。所以目前对选择秒那一列未禁用

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

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

相关文章

抖音直播间websocket礼物和弹幕消息推送可能出现重复的情况,解决办法

在抖音直播间里&#xff0c;通过websocket收到的礼物消息数据格式如下&#xff1a; {common: {method: WebcastGiftMessage,msgId: 7283420150152942632,roomId: 7283413007005207308,createTime: 1695803662805,isShowMsg: True,describe: 莎***:送给主播 1个入团卡,priority…

HarmonyOS4.0从零开始的开发教程17给您的应用添加通知

HarmonyOS&#xff08;十五&#xff09;给您的应用添加通知 通知介绍 通知旨在让用户以合适的方式及时获得有用的新消息&#xff0c;帮助用户高效地处理任务。应用可以通过通知接口发送通知消息&#xff0c;用户可以通过通知栏查看通知内容&#xff0c;也可以点击通知来打开应…

管理类联考——数学——真题篇——按题型分类——充分性判断题——蒙猜A/B

老规矩&#xff0c;看目录&#xff0c;平均3-5题 文章目录 A/B2023真题&#xff08;2023-19&#xff09;-A-选项特点&#xff1a;两个等号&#xff1b;-纯蒙猜-哪个长选哪个【不要用这招&#xff0c;因为两个选项&#xff0c;总会有一个长的&#xff0c;那不就大多都是A/B&…

透视数据:数据可视化工具的多重场景应用

数据可视化工具已经成为了许多领域中的重要利器&#xff0c;它们在各种场景下发挥着重要作用。下面我就以可视化从业者的角度简单谈谈数据可视化工具在不同场景下的应用&#xff1a; 企业数据分析与决策支持 在企业层面&#xff0c;数据可视化工具被广泛应用于数据分析和决策…

16 v-model绑定多选框

概述 使用v-model绑定多选框也是一种比较常见的需求&#xff0c;比如一个用户可以绑定多个角色&#xff0c;可以有多个兴趣爱好。 在本节课中&#xff0c;我们来学习一下这两种用法。 基本用法 我们创建src/components/Demo16.vue&#xff0c;在这个组件中&#xff0c;我们…

SpringCloud02

1.在项目中&#xff0c;服务之间的调用是怎么实现的&#xff1f; 1.1基于RestTemplate和LoadBalanced注解&#xff1a; RestTemplate是Spring提供的用于访问RESTful服务的客户端。添加LoadBalanced注解后&#xff0c;RestTemplate会成为一个负载均衡的HTTP客户端&#xff0c;它…

10.鸿蒙应用程序app创建第一个程序Helloworld

鸿蒙应用程序开发app_hap开发环境搭建 1.打开DevEco 2.创建项目 3.选择Empty Ability 4. 选择API6,支持java开发 5.点击Finish 6.启动本地模拟器参考方法 7.启动成功 8.运行程序 9.运行成功 其它文章点击专栏

HarmonyOS:Neural Network Runtime对接AI推理框架开发指导

场景介绍 Neural Network Runtime 作为 AI 推理引擎和加速芯片的桥梁&#xff0c;为 AI 推理引擎提供精简的 Native 接口&#xff0c;满足推理引擎通过加速芯片执行端到端推理的需求。 本文以图 1 展示的 Add 单算子模型为例&#xff0c;介绍 Neural Network Runtime 的开发流…

轻量封装WebGPU渲染系统示例<50>- Json数据描述材质等3D渲染场景信息

本示例中的3d渲染场景由Json数据来描述。 包含3个主要部分: 1. Json描述渲染器的基本信息。 2. Json描述渲染场景的环境信息,包括全局的灯光、阴影、雾等。 3. Json描述构成场景的各个可选人实体&#xff0c;包括几何信息、transform、材质、渲染状态等。 当前示例源码git…

开启创意之旅:免费、开源的噪波贴图(noise texture)生成网站——noisecreater.com详细介绍

在当今数字创意领域&#xff0c;噪波贴图&#xff08;Noise Texture&#xff09;是游戏渲染、游戏开发、美术设计以及影视制作等行业不可或缺的艺术素材之一。为了满足广大创作者的需求&#xff0c;noisecreater.com应运而生&#xff0c;成为一款免费、开源的噪波贴图生成工具。…

保护IP地址免受盗用的有效方法

IP地址是互联网通信的基础&#xff0c;然而&#xff0c;由于其重要性&#xff0c;IP地址的盗用成为一种潜在的网络威胁。本文将深入探讨防止IP地址被盗用的方法&#xff0c;以维护网络的安全性。 第一部分&#xff1a;IP地址盗用的威胁与风险 1.1 IP地址盗用的定义 IP地址盗…

数据可视化---离群值展示

内容导航 类别内容导航机器学习机器学习算法应用场景与评价指标机器学习算法—分类机器学习算法—回归机器学习算法—聚类机器学习算法—异常检测机器学习算法—时间序列数据可视化数据可视化—折线图数据可视化—箱线图数据可视化—柱状图数据可视化—饼图、环形图、雷达图统…

操作系统系列:Unix进程系统调用fork,wait,exec

操作系统系列&#xff1a;Unix进程系统调用 fork系统调用fork()运用的小练习 wait系统调用Zombiesexec 系列系统调用 开发者可以查看创建新进程的系统调用&#xff0c;这个模块会讨论与进程相关的Unix系统调用&#xff0c;下一个模块会讨论Win32 APIs相关的进程。 fork系统调用…

java参数校验

引入依赖 <!--参数效验--><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-starter-validation</artifactId></dependency><!--Length参数效验--><dependency><groupId>org.hib…

【python基础】-- yarn add 添加依赖的各种类型

目录 1、安装 yarn 1.1 使用npm安装 1.2 查看版本 1.3 yarn 淘宝源配置 2、安装命令说明 2.1 yarn add&#xff08;会更新package.json和yarn.lock&#xff09; 2.2 yarn install 2.3 一些操作 2.3.1 发布包 2.3.2 移除一个包 2.3.3 更新一个依赖 2.3.4 运行脚本 …

【设计模式--行为型--备忘录模式】

设计模式--行为型--备忘录模式 备忘录模式定义结构案例实现白箱备忘录模式黑箱备忘录模式 优缺点使用场景 备忘录模式 定义 又叫快照模式&#xff0c;在不破坏封装性的前提下&#xff0c;捕获一个对象的对象的内部状态&#xff0c;并在该对象之外保存这个状态&#xff0c;以便…

Java 自定义注解

Java 自定义注解&#xff0c; 以及interface Target Retention Around Before After ProceedingJoinPoint JoinPoint 等用法 注解应用非常广泛&#xff0c;我们自定义注解能简化开发各种各种业务 一、关键字解释 (1) 定义注解时&#xff0c;关键字 interface 来表示注解类的类…

Spring Boot学习随笔- 实现AOP(JoinPoint、ProceedingJoinPoint、自定义注解类实现切面)

学习视频&#xff1a;【编程不良人】2021年SpringBoot最新最全教程 第十一章、AOP 11.1 为什么要使用AOP 问题 现有业务层开发存在问题 额外功能代码存在大量冗余每个方法都需要书写一遍额外功能代码不利于项目维护 Spring中的AOP AOP&#xff1a;Aspect 切面 Oriented 面向…

竞赛保研 python 机器视觉 车牌识别 - opencv 深度学习 机器学习

1 前言 &#x1f525; 优质竞赛项目系列&#xff0c;今天要分享的是 &#x1f6a9; 基于python 机器视觉 的车牌识别系统 &#x1f947;学长这里给一个题目综合评分(每项满分5分) 难度系数&#xff1a;3分工作量&#xff1a;3分创新点&#xff1a;3分 &#x1f9ff; 更多资…

【Python 基础】-- 在 mac OS 中安装 多个 python 版本

目录 1、需求 2、实现 2.1 安装 pyenv 2.2 安装 pyenv-virtualenv 2.3 配置环境变量 2.4 创建 python 3.9.9 的环境 2.5 激活环境&#xff0c;在当前项目目录中使用&#xff0c;即执行 python 1、需求 由于项目所依赖的 python 版本有多个&#xff0c;需要在不同的 pyth…