elementUI中日期时间插件（DateTimePicke）限制选择时间（设置时间选择范围）

最新推荐文章于 2024-03-07 18:29:35 发布

奶糖肥晨

最新推荐文章于 2024-03-07 18:29:35 发布

阅读量830

点赞数 1

CC 4.0 BY-SA版权

分类专栏： el-element 文章标签： elementui vue.js javascript 前端 ecmascript

本文链接：https://blog.csdn.net/weixin_48998573/article/details/125214408

el-element 专栏收录该内容

18 篇文章

订阅专栏

这篇博客探讨了如何在JavaScript中实现一个日期选择器，通过设置`pickerOptions`来禁止选择比指定日期早的任何时间。示例代码展示了在Vue.js中使用`el-date-picker`组件，通过`disabledDate`函数判断并阻止用户选取早于`newlyAdded.startTime`的日期。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

js：

methods: {
            pickerOptions(date) {
                return{
                    disabledDate(time){
                        console.log(date)
                        return (
                                time.getTime() < new Date(date).getTime()
                        );
                    }
                }
            },
}

html：

<el-date-picker
                                    v-model="newlyAdded.endTime"
                                    type="datetime"
                                    value-format='yyyy-MM-dd HH:mm:ss'
                                    placeholder="请选择结束时间"
                                    :picker-options="pickerOptions(newlyAdded.startTime)">
                            </el-date-picker>