el-date-picker 限制开始时间和结束时间
需求:el-date-picker 月份限制开始时间和结束时间
开始时间:202307
结束时间:202407
代码实现
vue 页面
  <el-form-item label="月份" prop="monthlist">
          <el-date-picker v-model="allform.monthlist" type="monthrange" range-separator="至" start-placeholder="开始月份"
            end-placeholder="结束月份" value-format="yyyy-mm" :picker-options="pickeroptions">
          </el-date-picker>
   </el-form-item>script
<script>
export default {
 data() {
    return {
      allform: {},
      allrules: {
        monthlist: [
          { required: true, message: "日期不能为空", trigger: "blur" }
        ]
      },
      pickeroptions: {
        disableddate(time) {
          const now = new date()
          const year = now.getfullyear()
          const month = now.getmonth()
          // 去年当前月份的前一个月
          const startyear = year - 1
          const startmonth = month === 0 ? 11 : month - 1
          const startdate = new date(startyear, startmonth, 1)
          // 当前月份的前一月
          const endyear = year
          const endmonth = month === 0 ? 11 : month - 1
          const enddate = new date(endyear, endmonth, 1)
          return (
            time.gettime() < startdate.gettime() || time.gettime() > enddate.gettime()
          )
        }
      }
    }
  }
}
</script>效果图

到此这篇关于el-date-picker 限制开始时间和结束时间的文章就介绍到这了,更多相关el-date-picker 限制时间内容请搜索代码网以前的文章或继续浏览下面的相关文章希望大家以后多多支持代码网!
            
                                            
                                            
                                            
                                            
                                            
                                            
发表评论