目前官方的日期默认是当前日期,打开之后长这样子:现在是三月13日,但是有的需求是当前日期在后面。

就像这样:

代码如下:

default-value是设置当前日期默认值的。"timeDefaultShow"是在data里面的值,而不是方法。
<el-date-picker
v-model="pickerDate"
type="daterange"
range-separator="至"
start-placeholder="开始日期"
:picker-options="pickerBeginDateBefore"
:default-value="timeDefaultShow"
end-placeholder="结束日期"
size="small"
class="margin-right-10">
</el-date-picker>
data() {
return {
pickerBeginDateBefore:{
disabledDate(time) {
return time.getTime() > Date.now();
}
},
timeDefaultShow:'',
}
}

在created或mounted(也就是页面第一次加载时)更新timeDefaultShow:

上个月的当前日期为默认值

that.timeDefaultShow = new Date();
that.timeDefaultShow.setMonth(new Date().getMonth() - 1);

打开就是上面的效果了。

再说当前日期后面的日期不能选择:

(上面代码中有这句话)pickerBeginDateBefore也是一个值。附上官网链接(第一个例子里面有该方法):日期选择器

elementui 日期选择器设置当前默认日期(picker-options),以及当前日期以后的无法选择(default-value)的更多相关文章

  1. element-ui时间选择器--设置禁止选择的时间

    场景需求:开始日期不能小于今天,在今天之前的日期禁止选择,结束日期不能小于开始日期,开始日期之前的日期禁止选择. 效果图: element-ui的时间选择器中,有一个picker-options的属性 ...

  2. 基于bootstrap模态框的日期选择器

    近来由于工作需求,以bootstrap模态框+DIV+CSS+JS做了一个适用于移动端的日期选择器,能够满足多样的需求,目前处于第一个版本,后续可能会继续更新.废话不多说,直接进入制作过程. 首先,需 ...

  3. Android零基础入门第57节:日期选择器DatePicker和时间选择器TimePicker

    原文:Android零基础入门第57节:日期选择器DatePicker和时间选择器TimePicker 在实际开发中,经常会遇见一些时间选择器.日期选择器.数字选择器等需求,那么从本期开始来学习And ...

  4. Android中DatePicker日期选择器的使用和获取选择的年月日

    场景 实现效果如下 注: 博客: https://blog.csdn.net/badao_liumang_qizhi 关注公众号 霸道的程序猿 获取编程相关电子书.教程推送与免费下载. 实现 将布局改 ...

  5. 基于jQuery带备忘录功能的日期选择器

    今天给大家分享一款基于jQuery带备忘录功能的日期选择器.这款日期控制带有备记忘录功能.有备忘录的日期有一个圆圈,单击圆圈显示备忘录.该实例适用浏览器:360.FireFox.Chrome.Safa ...

  6. 日期选择器——java

    转载:http://zgdeng.iteye.com/blog/1405650 代码如下: import java.awt.BasicStroke; import java.awt.BorderLay ...

  7. 转:【微信小程序常见问题】下拉框选择器设置picker属性。(包括:城市、日期和时间选择器)

    1.picker写法(支持日期Date.时间Time和城市自定义) wxml文件 <picker bindchange="bindPickerChange" value=&q ...

  8. element-ui日期组件DatePicker设置日期选择范围Picker Options

    element-UI提供了DatePicker日期选择器组件,可以让我们很方便的获取到日期,默认的选择是全部的日期都可以选择的,但是很多场景中我们要对日期选择范围做限定,比如出行日期就不能选过去的日期 ...

  9. ElementUI 日期选择器 datepicker 选择范围限制

    在使用elementUI中日期选择器时,经常会遇到这样的需求——对可选择的时间范围有一定限制,比如我遇到的就是:只能选择今天以前的一年以内的日期. 查阅官方文档,我们发现它介绍的并不详细,下面我们就来 ...

随机推荐

  1. XStream 工具类 [ XmlUtil ]

    pom.xml <dependency> <groupId>com.thoughtworks.xstream</groupId> <artifactId> ...

  2. POJ:2010-Moo University - Financial Aid

    Moo University - Financial Aid Time Limit: 1000MS Memory Limit: 30000K Total Submissions: 10894 Acce ...

  3. Android 时间计算工具 通用类TimeUtil

    1.整体分析 1.1.源代码如下,可以直接Copy. public class TimeUtil { private static final String TAG = "TimeUtil& ...

  4. JSP---JSTL核心标签库的使用

    JSTL 核心标签库标签共有13个,功能上分为4类: 1.表达式控制标签:out.set.remove.catch 2.流程控制标签:if.choose.when.otherwise 3.循环标签:f ...

  5. 6 URL 实习文章链接跳转

    需要解决的三个问题? . 1.不够多的URL (1)正则表达式 (2)\d 数字 /detail/123 /detail/(\d){3} #限定3个数字 /detail/(\d+) #限定多个数字 ( ...

  6. android版本vqmon移植IOS版

    IOS交叉编译 1.android版本 vqmon已经正常运行,现需要开放IOS版本,作移植工作. 2. 注意事项: 1)ROOT权限,IOS必须越狱.  2)依赖库:pcap, ffmpeg,lib ...

  7. 最“高大上”的Spring测试:Spring Test

    我想给大家介绍一款非常实用.且高端大气上档次的spring测试,在这里,我要强烈推荐使用Spring的Test Context框架,为什么呢?俗话说,“货比三家不上当”,要搞清楚这个问题,我们先来看一 ...

  8. WPF and Silverlight.ComboBox 如何通过 Binding IsDropDownOpen 实现下拉菜单展开

    In the WPF example the Popup and the ToggleButton (the arrow on the right) are bound with the proper ...

  9. 一道简单的CTFpython沙箱逃逸题目

    看了几天的ssti注入然后了解到有python沙箱逃逸 学过ssti注入的话python沙箱逃逸还是很容易理解的. 看一道CTF题目,源码的话我改了改,一开始不能用,直接在py2上运行就好. 题目要求 ...

  10. Linux - Shell - 常用方法 - 备忘录

    $? 上一个指令的返回值 =成功,=失败 dmesg 检测系统开机启动信息 $() 对命令的替换,同`` ${} 对变量的替换,同$var $(()) 对内部内容进行整数运算 i= grep AAA ...