【vue + elementUI】日期选择器限制选择范围

elementPlus写法

<el-date-picker v-model="effectTime" type="datetime" placeholder="请选择生效时间" 
				:disabled-date="disabledDate"></el-date-picker>
const effectTime = ref(new Date())

const disabledDate = (time) =>{
    
    
    // return time.getTime() < Date.now();          // 选择今天以后的日期(不含今天)
    return time.getTime() < Date.now() - 8.64e7     // 选择今天及今天以后的日期
    // return time.getTime() > Date.now() - 8.64e6  // 选择今天及今天以前的日期
    // return time.getTime() > Date.now() - 8.64e7  // 选择今天以前的日期(不含今天)
    
}

elementUI写法

<el-date-picker value-format="timestamp" v-model="effectTime" type="datetime" 
				placeholder="请选择生效时间" 
				:picker-options="pickerOptions"></el-date-picker>
data() {
    
    
        return{
    
    
            effectTime:'',
          
            pickerOptions: {
    
    
                disabledDate(time){
    
    
                    return time.getTime() < Date.now(); // 限制选择 今天以后的日期
                }
            }
        }
    },

猜你喜欢

转载自blog.csdn.net/qq_36687211/article/details/131002341