antd a-range-picker的自定义日期范围选择以及反显

1,691 阅读1分钟
                  class="rangePicker"
                  show-time
                  :format="dateFormat"
                  v-model="rangeTime"
                  @change="getRangeTime"
                  :ranges="{
                '本周': [moment().startOf('week'),moment().endOf('week')],
                '本月': [moment().startOf('month'), moment().endOf('month')]}"
                  :allowClear="false"
/>
export default {
    data() {
      return {
        dateFormat: 'YYYY-MM-DD',
        rangeTime:[],
        startTime:'',
        endTime:'',
      }
    },
}
methods{
getRangeTime(val){
        this.startTime=val[0]?moment(val[0]._d.getTime()).format('YYYY-MM-DD'):''
        this.endTime=val[1]?moment(val[1]._d.getTime()).format('YYYY-MM-DD'):''
      }
}
//回显的时候必须转化为moment,时间必须非空,否则会报错(这里的this.$route.query.startTime是其他页面传过来的时间,格式为2021-03-10),同时绑定的this.rangeTime是一个数组。
this.rangeTime.push(moment(this.$route.query.startTime),moment(this.$route.query.endTime))