首页 > 其他 > 详细

element UI 日期组件(限制开始日期和结束日期范围)

时间:2020-07-21 15:18:53      阅读:56      评论:0      收藏:0      [点我收藏+]

 

技术分享图片

 

 

                <!--日期start-->
                    <el-form-item label="提交时间:">
                        <div class="block">
                            <!-- <span class="demonstration"></span> -->

                            <el-date-picker
                                value-format="yyyy-MM-dd" 
                                v-model="searchFrom.begTime"
                                :picker-options="startDateLimit"
                                placeholder="开始日期">
                            </el-date-picker>
                            -
                            <el-date-picker
                                value-format="yyyy-MM-dd" 
                                v-model="searchFrom.endTime"
                                :picker-options="endDateLimit"
                                placeholder="结束日期">
                            </el-date-picker>
                        </div>
                    </el-form-item>
               <!--日期end-->                        

  

 

 

 

技术分享图片

 

 

se        archFrom: sessionStorage.getItem("save_search") ? JSON.parse(sessionStorage.getItem("save_search")):{
                    orderStatus: "",
                    orderNo: ‘‘,
                    begTime:"",
                    endTime:"",
                    supplierInfoName:"",
                    userName:"",
                    purchaseType:""
                },
                //日期限制
                startDateLimit: {
                    disabledDate: (time) => {
                        let endTime = this.searchFrom.endTime;
                        if (endTime) {
                            return time.getTime() > new Date(endTime).getTime();
                        }
                    }
                },
                endDateLimit: {
                    disabledDate: (time) => {
                        let beginTime = this.searchFrom.begTime;
                        if (beginTime) {
                            return time.getTime() < new Date(beginTime).getTime() - 8.64e7;  //开始和结束可以选择同一天
                        }
                    }
                },

  

element UI 日期组件(限制开始日期和结束日期范围)

原文:https://www.cnblogs.com/swt-axios/p/13354505.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!