(问题解决)Element ui中 DatePicker 日期选择器的时间格式化

原创于 2021-07-06 09:35:00 发布 · 3.7k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js

小翟的后端学习之路专栏收录该内容

13 篇文章

订阅专栏

本文介绍了如何使用El-DatePicker组件来满足特定的日期格式需求。通过调整`format`和`value-format`属性，可以定制显示和绑定值的日期格式。示例中展示了将日期格式改为`yyyy-MM-dd`和`yyyy-MM-dd HH:mm:ss`的过程，帮助开发者更好地理解和应用组件。

当使用DaTe Picker组件时，确实很方便，但是还是不能完全满足需求，如下的日期格式就不是我想要的，需要改成我们需要的日期格式。

看一下具体的属性描述，format可以格式化输入框中的格式，value-format 可以格式化绑定值的格式。

                    <el-date-picker
                            v-model="searchStart"
                            type="date"
                            placeholder="选择起始日期"
                            format="yyyy-MM-dd"
                            value-format="yyyy-MM-dd HH:mm:ss"
                    >
                    </el-date-picker>
                    <el-date-picker
                            v-model="searchEnd"
                            type="date"
                            placeholder="选择结束日期"
                            format="yyyy-MM-dd HH:mm:ss"
                            value-format="yyyy-MM-dd"
                    >
                    </el-date-picker>

搞定