<el-date-picker
v-model="ruleForm.pickDateMeal"
type="daterange"
align="right"
:range-separator="$t('message.To')"
:start-placeholder="$t('message.Start_date')"
:end-placeholder="$t('message.End_date')"
@change="getDateHandler"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
:picker-options="pickerOptions2"
:default-value="defalutDate"
>
</el-date-picker>
pickerOptions2: {
shortcuts: [{
text: '星期一',
onClick (picker) {
const end = new Date()
const start = new Date()
_this.getDaysMonday(start, 90, 2, 1, _this.allDays)
picker.$emit('pick', [start, end])
}
}, {
text: '星期二',
onClick (picker) {
const end = new Date()
const start = new Date()
_this.getDaysMonday(start, 90, 2, 2, _this.allDays)
picker.$emit('pick', [start, end])
}
}, {
text: '星期三',
onClick (picker) {
const end = new Date()
const start = new Date()
_this.getDaysMonday(start, 90, 2, 3, _this.allDays)
picker.$emit('pick', [start, end])
}
}, {
text: '星期四',
onClick (picker) {
const end = new Date()
const start = new Date()
_this.getDaysMonday(start, 90, 2, 4, _this.allDays)
picker.$emit('pick', [start, end])
}
}, {
text: '星期五',
onClick (picker) {
const end = new Date()
const start = new Date()
_this.getDaysMonday(start, 90, 2, 5, _this.allDays)
picker.$emit('pick', [start, end])
}
}, {
text: '星期六',
onClick (picker) {
const end = new Date()
const start = new Date()
_this.getDaysMonday(start, 90, 2, 6, _this.allDays)
picker.$emit('pick', [start, end])
}
}, {
text: '星期日',
onClick (picker) {
const end = new Date()
const start = new Date()
_this.getDaysMonday(start, 90, 2, 0, _this.allDays)
picker.$emit('pick', [start, end])
}
}, {
text: '今天',
onClick (picker) {
picker.$emit('pick', new Date())
}
}
],
// 设置选择今天以及今天之后的日期
disabledDate (time) {
return time.getTime() < Date.now() - 8.64e7
}
}

elementUI 日期 周一、周二、周三、周四、周五、周六、周日快捷键的更多相关文章

  1. SQL取出 所有周六 周日的日期

    SQL取出 所有周六 周日的日期 create table SatSun([id] int identity(1,1),[date] datetime,[weekday] char(6)) go de ...

  2. vue element-ui 日期选择器组件 日期时间格式化

    vue element-ui 组件开发大大提高了我们的效率,但有时候并不能满足我们的需求,例如时间,日期组件: element-ui 日期返回的格式是这样的,看下图: 但我们要的是另一个格式 , 如下 ...

  3. ElementUI日期选择器时间选择范围限制

    ElementUI是饿了么推出的一套基于vue2.x的一个ui框架.官方文档也很详细,这里做一个element-ui日期插件的补充,官方文档中使用picker-options属性来限制可选择的日期,这 ...

  4. element-ui 日期选择器范围时间限制

    来自 https://www.cnblogs.com/xjcjcsy/p/7977966.html 侵删 ElementUI是饿了么推出的一套基于vue2.x的一个ui框架.官方文档也很详细,这里做一 ...

  5. C#去掉周六周日的算法

    /// <summary> /// 用来获取工作日(不含周六周日) /// </summary> /// <param name="dtSub"> ...

  6. WPF 自定义Calendar样式(日历样式,周六周日红色显示)

    一.WPF日历控件基本样式 通过Blend获取到Calendar需要设置的三个样式CalendarStyle.CalendarButtonStyle.CalendarDayButtonStyle.Ca ...

  7. 关于element-ui日期选择器disabledDate使用心得

    实现目的: 使用type="data"类型实现具备开始日期与结束日期组件(ps:element有自带的type="daterange"类型的组件可以实现此功能) ...

  8. element-ui日期组件DatePicker选择日期范围赋值编辑问题

    最近在项目中使用element-UI的日期范围组件时遇到一个问题,相信很多人也做过这种场景,一个录入页面也同时是编辑页面,编辑的时候就需要先赋值.但是我给date组件赋值后,确无法操作了,change ...

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

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

随机推荐

  1. 转-【exp/imp】将US7ASCII字符集的dmp文件导入到ZHS16GBK字符集的数据库中

    原帖地址:http://blog.csdn.net/lihuarongaini/article/details/71512116 1.2  前言部分 1.2.1  导读和注意事项 各位技术爱好者,看完 ...

  2. 将你的Vim 打造成轻巧强大的IDE

    Vim和Emacs一个称为神之编辑器一个被称为编辑器之神,固然很是夸张,但也足以说明这两 款软件的优秀和在程序员界的地位.但是它们都已漫长的学习曲线让人望而生畏,阻止了大 多数人进入.作为一名几乎完全 ...

  3. zzw原创_oracle循环中的异常捕捉_捕捉异常后并继续循环

    例子如下 set serveroutput on; declare   V_SQL VARCHAR2(255);   errorCode number; --异常编码     errorMsg var ...

  4. Qt Widgets——动作类与小部件菜单项

    本文主要涉及以下三个类: QAction ——QWidgetAction QActionGroup QAction可称为动作类,它一般可当作菜单中的项组成菜单,也可作为工具栏上的按钮,它主要由图标.文 ...

  5. 运行B/s项目时,出现尝试访问类型与数组不兼容元素问题?

    1.问题描述 运行B/s项目时,浏览器出现应用程序中服务器错误(尝试访问类型与数组不兼容的元素) 2.问题原因 本人是项目引用的dll版本不一致问题,引用的System.Web.Mvc版本是4.0.0 ...

  6. 微信公众号 access_token 没有过期 却失效

    最近在开发微信项目的时候 access_token   缓存到 redis里面的,明明在两个小时的有效期内  微信却提示 "errcode":40001,"errmsg& ...

  7. ldap+flask+python2实现统一认证里面的那些编码神坑

    首先想吐槽下,直接接手别人的项目,而且是经过四五个人手的项目,是怎么个痛苦.两三套代码django.flask.tornado应有尽有,代码里,掰开手指头就可数的全英文注释,几台服务器没交接清楚,所有 ...

  8. Java反射《四》获取方法

    package com.study.reflect; import java.lang.reflect.InvocationTargetException; import java.lang.refl ...

  9. hdu1693

    题解: 还是插头dp 代码: #include<cstdio> #include<cstring> #include<algorithm> #include< ...

  10. JDK1.8源码逐字逐句带你理解LinkedHashMap底层

    注意 我希望看这篇的文章的小伙伴如果没有了解过HashMap那么可以先看看我这篇文章:http://blog.csdn.net/u012403290/article/details/65442646, ...