示例图片示例图片

  1. 导入moment
 <script>
import moment from 'moment';
export default {
  data() {
    return {
      dateFormat: 'YYYY-MM-DD',
    };
  },
  methods: {
    moment,
  },
};
</script>
  1. 设置defaultValue默认日期类型为moment
    HTML部分
<a-range-picker class="range" @change="onChange"
            showToday :default-value="[
            moment(getCurrentDataL(), dateFormat),
            moment(getCurrentDataR(), dateFormat),
          ]"
          :format="dateFormat"  />

js的method部分

methods: {            
            moment,//moment引入
            //这里我的需求是默认展示十天前至昨天,其他的更改getday后的值即可
            getCurrentDataL() {                
                return this.getDay(-10);
            },
            getCurrentDataR() {
                // return new Date().toLocaleDateString();
                return this.getDay(-1);
            },
            onChange(date, dateString) {
                this.Bus.$emit("datePicker", dateString);
            },
            // 获取当前时间,day为number,getDay(-1):昨天的日期;getDay(0):今天的日期;getDay(1):明天的日期;【以此类推】
            getDay(day) {
                var today = new Date();
                var targetday_milliseconds = today.getTime() + 1000 * 60 * 60 * 24 * day;
                today.setTime(targetday_milliseconds); //注意,这行是关键代码
                var tYear = today.getFullYear();
                var tMonth = today.getMonth();
                var tDate = today.getDate();
                tMonth = this.doHandleMonth(tMonth + 1);
                tDate = this.doHandleMonth(tDate);
                return tYear + "-" + tMonth + "-" + tDate;
            },
            // 处理月份数据
            doHandleMonth(month) {
                var m = month;
                if (month.toString().length === 1) {
                    m = "0" + month;
                }
                return m;
            },
}

页面展示时想要达到用户进入时已默认检索十天前至昨天的数据
添加create

created() {
            this.value[0] = this.getDay(-10);
            this.value[1] = this.getDay(0);
        },
//另外需要在data中定义value
data() {
            return {
                value: [],
                dateFormat: 'YYYY-MM-DD',
            };
        },
Logo

前往低代码交流专区

更多推荐