vue+element设置选择日期最大范围(普通版)
效果是只能跟当天时间有关(30天),下一篇将来的任意时段,比较符合实际
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
</head>
<body>
<div id="app">
<el-date-picker
v-model="value"
type="daterange"
unlink-panels
range-separator="至"
start-placeholder="开始日期"
end-placeholder="结束日期"
:picker-options="pickerOptions">
</el-date-picker>
</div>
</body>
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
new Vue({
el: '#app',
data: function() {
return {
value:'',
pickerOptions: {
disabledDate(time) {
let curDate = (new Date()).getTime(); // 当前日期
let one = 31 * 24 * 3600 * 1000; //一个月时间
let oneMonth = curDate - one; //时间差
return (time.getTime() > (Date.now()- 8.64e7)) || time.getTime() < oneMonth; //如果当天可选 就不用减8.64e7
}
},
}
},
methods:{ }
})
</script>
</html>
vue+element设置选择日期最大范围(普通版)的更多相关文章
- MTK Android 设置-选择日期格式 [管理和组织首选项,ListPreference,CheckBoxPreference,EditTextPreference,RingtonePreference]
###android.preference.ListPreference的一些特性 android:key 选项的名称或键 android:title 选项的标题 android:summary ...
- layui日历控件设置选择日期不能超过当前日期
layui.use('laydate', function() { var laydate = layui.laydate; laydate.render({ elem : '#begin', max ...
- Vue+Element实现网页版个人简历系统
这篇文章介绍一个使用Vue+Element实现的个人简历系统,主要用到的技术有:vue.element.css3.css定位. 作者在window10进行开发,目前只在chrome上进行过测试,没有大 ...
- vue+element ui 的时间控件选择 年月日时分
前言:工作中用到 vue+element ui 的前端框架,需要选择年月日时分,但element ui官网demo有没有,所以记录一下.转载请注明出处:https://www.cnblogs.com/ ...
- 自定义Vue&Element组件,实现用户选择和显示
在我们很多前端业务开发中,往往为了方便,都需要自定义一些用户组件,一个是减少单一页面的代码,提高维护效率:二个也是方便重用.本篇随笔介绍在任务管理操作中,使用自定义Vue&Element组件, ...
- 在基于ABP框架的前端项目Vue&Element项目中采用日期格式处理,对比Moment.js和day.js的处理
Day.js 是一个轻量的处理时间和日期的 JavaScript 库,和 Moment.js 的 API 设计保持完全一样. 如果您曾经用过 Moment.js, 那么您已经知道如何使用 Day.js ...
- vue+element ui中select组件选择失效问题原因与解决方法
codejing 2020-07-10 09:13:31 652 收藏 分类专栏: Web Vue Element UI 版权 .当表单form赋完值后,如果后续又对form中某一属性值进行操作如 ...
- My97DatePicker设置,包括隐藏 清空,设置最大日期等 转载
My97DatePicker是一款非常灵活好用的日期控件.使用非常简单. 1.下载My97DatePicker组件包 2.在页面中引入该组件js文件: <script type=&quo ...
- 循序渐进VUE+Element 前端应用开发(15)--- 用户管理模块的处理
在前面随笔介绍了ABP+Vue前后端的整合处理,包括介绍了ABP的后端设计,以及前端对ABP接口API的ES6的封装,通过JS的继承类处理,极大减少了重复臃肿的代码,可以简化对后端API接口的封装,而 ...
- 循序渐进VUE+Element 前端应用开发(25)--- 各种界面组件的使用(1)
在我们使用Vue+Element开发前端的时候,往往涉及到很多界面组件的使用,其中很多直接采用Element官方的案例即可,有些则是在这个基础上封装更好利用.更少代码的组件:另外有些则是直接采用第三方 ...
随机推荐
- 深入在线文档系统的 MarkDown/Word/PDF 导出能力设计
深入在线文档系统的 MarkDown/Word/PDF 导出能力设计 当我们实现在线文档的系统时,通常需要考虑到文档的导出能力,特别是对于私有化部署的复杂ToB产品来说,文档的私有化版本交付能力就显得 ...
- KingbaseES V8R6集群备份恢复案例之---备份初始化“can not find primary node”故障
案例说明: KingbaseES V8R6集群,备库作为repo-path节点,建立类型为'cluster'模式的备份,在执行sys_backup.sh init时,出现"can not f ...
- C++中自定义事件与委托
自定义事件,和委托其实是一类操作. 在蓝图中都表现为红色方块. 自定义事件通过DECLARE_EVENT(ClassName, EventName)来创建一个属于ClassName的EventName ...
- 关于Actor Component的思考--学习斯坦佛UE+C++
跟着B站的视频学习,感觉自己的头很混乱.所以浅浅总结一下创建Actor Component之后其的作用和相关操作. Actor Component 首先Component为一个组件,源码就是一个类的声 ...
- Java面试题【1】
Java面试题总结 2022-05-20 1)Java有没有goto? goto是C语言中的,通常与条件语句配合使用,可用来实现条件转移, 构成循环,跳出循环体等功能.Java保留了这个关键字但是没有 ...
- #交互,鸽笼原理#CF1776C Library game
题目 有一个长度为 \(m\) 的书架,以及 \(n\) 个长度 \(a_1,a_2,\dots,a_n\) Alessia 和 Bernardo 从书架上取书.每次由 Alessia 选择一个之前没 ...
- #根号分治#洛谷 3645 [APIO2015]雅加达的摩天楼
题目传送门 分析 设 \(d[i][j]\) 表示 所处位置为 \(i\),跳跃能力为 \(j\) 的步数, 若 \(j\leq \sqrt{n}\),这样的状态最多有 \(n\sqrt{n}\) 个 ...
- go~在阿里mse上使用redis.call
相关依赖 github.com/higress-group/proxy-wasm-go-sdk github.com/alibaba/higress/plugins/wasm-go 标准的redis ...
- Numpy的数组对象
数组对象 NumPy 最重要的一个特点是其 N 维数组对象 ndarray,它是一系列同类型数据的集合,从0 开始进行集合中元素的索引:ndarray 对象是用于存放同类型元素的多维数组,其中的每个元 ...
- Buffer 与 Mat 互转
Linux系统做音视频开发,很多时候要用到opencv,就需要把图片Buffer数据转换成Mat对象来使用 Buffer 转 Mat Mat Buffer2Mat(unsigned char* buf ...