vue ant DatePicker 日期选择器默认当前月 或默认多少天

需求：数据量太大时，初始进入页面 默认展示两周或一个月数据
1.默认进去初始当前月

<template>
 <a-form-item label="添加时间">
   <a-range-picker :placeholder="['开始时间', '结束时间']" :value="createValue" format="YYYY-MM-DD" @change="onChange" />
  </a-form-item>
</template>
 created() {
    this.getInitializeDate();//获取当月默认日期（当月1号到当天）
  },
  method：{
	  getInitializeDate() {
	      let date = new Date()//获取新的时间
	      //获取当前年份,并且转为字符串
	      let year = date.getFullYear().toString()
	      //获取当前月份，因为月份是要从0开始，此处要加1，
	      //使用三元表达式，判断是否小于10，如果是的话，就在字符串前面拼接'0'
	      let month = date.getMonth()   1 < 10 ? '0'   (date.getMonth()   1).toString() : (date.getMonth()   1).toString()
	      //获取天，判断是否小于10，如果是的话，就在在字符串前面拼接'0'
	      let day = date.getDate() < 10 ? '0'   date.getDate().toString() : date.getDate().toString()
	      //字符串拼接，将开始时间和结束时间进行拼接
	      let start = year   '-'   month   '-01'    //当月第一天
	      let end = year   '-'   month   '-'   day  //当天
	      this.createValue = [start, end] //将值设置给组件DatePicker 绑定的数据
	    },
  }
  

2.默认进去显示14天 比较简单 多少天 下方代码数字填多少就可以了

 <a-col :md="8" :sm="24">
   <a-range-picker style="width:100%;" :placeholder="['开始时间', '结束时间']" :value="createValue" format="YYYY-MM-DD" @change="onChange"  />
 </a-col>
import dayjs from 'dayjs';
 created() {
 //是要传给后端的值  进行了日期格式化
   this.queryParam.opSTime = dayjs(moment().startOf('day').subtract(14, 'd')).format('YYYY-MM-DD');
   this.queryParam.opETime = dayjs(moment().endOf('day')).format('YYYY-MM-DD');
   //列表接口请求
   this.loadList(1);
   //日期选择器页面显示的值 
   this.createValue = [moment().startOf('day').subtract(14, 'd'), moment().endOf('day')]
  },

这篇好文章是转载于：学新通技术网