element ui el-time-picker 时间选择其组件的坑点记录

需求：需要进行一个时间区间的选择

遇到的问题：需要设置默认值，只需要拿到小时和分的时间格式。

<el-time-pickeris-rangestyle="width:500px"  //必须设置宽度，不然会导致刷新或初始化的时候撑不开这个组件:disabled="isDisabled"v-model="form.time"range-separator="至"start-placeholder="开始时间"end-placeholder="结束时间"placeholder="选择时间范围"value-format="HH:mm"format="HH:mm"></el-time-picker>

必须设置默认的时间，不然无法进行时间的选择，组件里显示的为空数据

data(){return {form:{time: [new Date(2020, 1, 1, 9, 0), new Date(2020, 12, 31, 18, 0)],}}
}

如果设置有默认事件，直接用后台的返回事件，会导致传给后台的格式不正确，所以要对这种情况进行单独的时间格式化

if (typeof this.form.time[0] == "object") {startTime = moment(this.form.time[0]).format("HH:mm");endTime = moment(this.form.time[1]).format("HH:mm");} else {startTime = this.form.time[0];endTime = this.form.time[1];}
}

element ui el-time-picker 时间选择其组件的坑点记录相关推荐

elementui 上传七牛_用element ui上传图片到七牛踩过的坑
前端上传图片到七牛云的流程请求后端接口获取上传凭证请求七牛云地址上传图片到七牛云上传完毕将获得七牛云返回的图片地址七牛云地址说到七牛云地址,奴家真的是一把鼻涕一把泪刚开始做图片上传的时候, ...
修改element UI的select下拉框组件右边的小箭头（使用自定义图片）
i.el-select__caret {/*很关键:将默认的select选择框样式清除*/ appearance:none;-moz-appearance:none;-webkit-appearanc ...
Element UI库的入门使用
Element UI 有的 ul 库在 style 上添加 scoped 后可能会导致自定义样式失效.element ui 可以支持 scoped 多用于管理系统的开发,有明确设计稿的情况下一般不方便 ...
【RuoYi-Vue-Plus 实现日期范围查询 Mybatis-Plus Element UI JavaScript 】
Element UI 实现日期范围查询,多个日期范围查询. 文章目录 Element UI 实现日期范围查询,多个日期范围查询. 前言一.前端Element - UI(DatePicker 日期选择 ...
Element UI 分页器
人是为活着本身而活着,而不是为了活着之外的任何事物所活着.-- 余华<活着> 安装 Element UI npm i element-ui -S 引入组件 import { Paginat ...
优化element ui中的弹框样式
element ui 虽然提高了开发效率,但是坑也不少,比如弹框的体验就不佳: 弹框体验不佳自带的弹框样式有很多缺点,比如不居中,大小会超出屏幕然后在最右侧出现滚动条,看不到footer里的按钮等. ...
从Element ui看开发公共组件的三种方式
在日常的开发工作中,封装自己的公共组件是很常见的需求,但想要组件更加优雅和通用也是一门学问.恰好前段时间用过Element ui,于是想学习这种库是如何封装插件的,这篇文章就是我的一点理解. 从入口文 ...
Element UI 组件库分析和二次开发（一）
我的本地开发环境:M1 芯片Mac,node v12.22.10. 一.Element UI 组件库二次开发的大致流程 1. 从 Element 官方 clone 一份 dev 源码到本地 2. 安装 ...
vue组件库介绍以及组件库Element UI 的使用
组件库前言这篇文章介绍vue组件库! 介绍什么是组件库以及Element UI组件库的使用! 看完不会你打我.哈哈哈,开玩笑的,不多说,上刺刀!! 1. 什么是 vue 组件库在实际开发中,前端 ...

element ui el-time-picker 时间选择其组件的坑点记录

element ui el-time-picker 时间选择其组件的坑点记录相关推荐

最新文章

热门文章