01-ElementUI_日期选择器默认展示当前月份在右边

应用场景: 当前日期的查询所有数据皆为过往数据(历史数据), 时间在当下往前
默认: 当前月份展示在左边.
实现: 点击选择时自动点击下个月按钮

 <!-- html -->
<span @click="changeInitCalendarRange">          
      <el-date-picker v-model="dateRange" type="datetimerange" range-separator="至" start-placeholder="开始日期" end-placeholder="结束日期" @change="onsetmonitor" :default-time="['00:00:00', '23:59:59']" :clearable="false">               
      </el-date-picker>           
</span>

// js
// 定义countss
data() {       
 return { 
   dateRange:[],
   countss: 0,
 }
},
methods: {
  changeInitCalendarRange() {
    if (this.countss > 0) return;
    this.countss++;
    let element = document.querySelector("button.el-picker-panel__icon-btn.el-icon-arrow-left");
    if (element) element.click();  // 点击一次下个月
  },
  //如果选定值，重置countss
  onsetmonitor() {
    if (this.dateRange) return;
    this.countss = 0;   // 当日期数据为[]时重置
  }
}

另外, ElementPlus也适用, 但是要修改一下获取元素的类名: .arrow-left

let element = document.querySelector("button.el-picker-panel__icon-btn.arrow-left");

结束.