項(xiàng)目中經(jīng)常會使用到日期選擇器，并且會對可選擇的日期有要求，分享幾個常用的，給大家作參考。文章來源地址http://www.zghlxwxcb.cn/news/detail-732754.html

• 只能選擇當(dāng)前日期前（不包含當(dāng)前日期）

<template>
  <el-date-picker
    v-model="selectedDate"
    :picker-options="pickerOptions"
    type="date"
    placeholder="選擇日期"
  ></el-date-picker>
</template>

<script>
export default {
  data() {
    return {
      selectedDate: null,
      pickerOptions: {
        disabledDate(time) {
          const now=8.64e7;
          return time.getTime()  > Date.now()-now;
        }
      }
    };
  }
};
</script>

• ?只能選擇當(dāng)前日期前（包含當(dāng)前日期）

<template>
  <el-date-picker
    v-model="selectedDate"
    :picker-options="pickerOptions"
    type="date"
    placeholder="選擇日期"
  ></el-date-picker>
</template>

<script>
export default {
  data() {
    return {
      selectedDate: null,
      pickerOptions: {
        disabledDate(time) {
          return time.getTime()  > Date.now();
        }
      }
    };
  }
};
</script>

• 指定日期范圍（例如2022年12月1日至當(dāng)前日期）

• <template>
    <el-date-picker
      v-model="selectedDate"
      :picker-options="pickerOptions"
      type="date"
      placeholder="選擇日期"
    ></el-date-picker>
  </template>
  
  <script>
  export default {
    data() {
      return {
        selectedDate: null,
        pickerOptions: {
          disabledDate(time) {
            const startDate = new Date('2022-12-01');
            const endDate = new Date();
            return time < startDate || time > endDate;
          }
        }
      };
    }
  };
  </script>

到了這里，關(guān)于element UI日期選擇器固定選擇范圍的文章就介紹完了。如果您還想了解更多內(nèi)容，請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！