vue element-ui 设置时间组件

备注：设置开始时间小于结束时间

               <!-- 开始时间 -->
                <div class="block">
                    <!-- <span class="demonstration">开始时间</span> -->
                    <el-date-picker
                    v-model="startTime"
                    type="date"
                    placeholder="选择开始日期"
                    :picker-options="pickerOptionsStart">
                    </el-date-picker>
                </div>
                <span style="color: #333333;font-size: 14px;">至</span>
                <!-- 结束时间 -->
                <div class="block">
                    <!-- <span class="demonstration">结束时间</span> -->
                    <el-date-picker
                    v-model="endTime"
                    type="date"
                    placeholder="选择结束日期"
                    :picker-options="pickerOptionsEnd">
                    </el-date-picker>
                </div>

    data() {
        return {
            startTime: '',
            endTime: '',
            pickerOptionsStart: {
                disabledDate: (time) => {
                if (this.endTime !== '') {
                    // return time.getTime() < Date.now() - 8.64e7 || time.getTime() > this.endTime
                    return  time.getTime() > this.endTime
                } else {
                    // return time.getTime() < Date.now() - 8.64e7
                }
                }
            },
            pickerOptionsEnd: {
                disabledDate: (time) => {
                if (this.startTime !== '') {
                    return time.getTime() < this.startTime
                } else {
                    // return time.getTime() < Date.now()
                    // return time.getTime() < Date.now() - 8.64e7
                }
                }
            },

        }
    },

 

转载于:https://www.cnblogs.com/lst619247/p/10689965.html