本文介绍: 最近在使用芋道框架时候,后端使用生成代码,时间因为类型问题,只能是时间戳,否则为空(1970-)前端其实很简单只要在日期选择器把类型改成时间错即可,但根据业务需求需要精确到时分秒把时间戳的类型转换过来,就会发现日期是选择的哪一天,但是时分秒是当前电脑的时分秒但是根据业务需求需要控制时分秒如(1949-10-1 00:00:00 1949-10-1 23:59:59)
前言
解决方案
使用日期选择器我们可是使用字符串类型的就可以控制时分秒写死,但是这样后端存储不了(只能存时间戳)
使用date对象在提交时候先new date 转换成标准时间,在使用Date.parse 把标准时间转换成时间戳就解决了
代码
// 此时是字符串时间-可以精确到任意时分秒
<el-date-picker
v-model="contractform.startDate"
type="date"
value-format="yyyy-MM-dd 00:00:00"
placeholder="选择日期"
/>
// 提交时操作,字符串时间-标准时间-时间戳时间
this.contractform.startDate = Date.parse(
new Date(this.contractform.startDate)
)
2.禁止选择今天之前日期,或者今天之后日期
// 日期选择器其实也提供方法Picker Options
<el-date-picker
v-model="date"
type="date"
size="small"
value-format="yyyy-MM-dd"
format="yyyy-MM-dd"
:placeholder="'选择日期'"
:picker-options="pickerOptions"
/>
今天之前的日期禁止选择-直接写在data里面即可
// - 8.64e7今天可选,不减今天不可选
pickerOptions: {
disabledDate(time) {
return time.getTime() < Date.now() - 8.64e7;
}
}
不能选择今日之后的日期(今天可选-直接写在data里面即可
// - 8.64e7今天不可选 不减今天可选
pickerOptions: {
disabledDate(time) {
return time.getTime() > Date.now();
}
}
总结:
经过这一趟流程下来相信你也对 element–ui DatePicker 日期选择器–控制选择精确到时分秒-禁止选择今天之前-或者今天之后日期 有了初步的深刻印象,但在实际开发中我 们遇到的情况肯定是不一样的,所以我们要理解它的原理,万变不离其宗。加油,打工人!
原文地址:https://blog.csdn.net/weixin_53579656/article/details/134628852
本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。
如若转载,请注明出处:http://www.7code.cn/show_22672.html
如若内容造成侵权/违法违规/事实不符,请联系代码007邮箱:suwngjj01@126.com进行投诉反馈,一经查实,立即删除!
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。