在開發過程中可能根據需要設置一個默認的時間段，在網上看了很多相關的信息，大多數都顯得很籠統並且麻煩，研究了一下el-date-picker 插件的屬性，發現了一個比較簡單的方法，來跟大家分享一下。
1.需求分析
當用戶打開某一個需要查詢數據的頁面時，插件默認顯示上一個月的時間，如當前三月則需要顯示二月份：
考慮到每一個月的天數不一定，但是每一個月都是從一號開始，所以只要終止日期小於下一個月1號就可以滿足需求，所以最後效果可以爲這樣：
前提是先聲明後端查詢時需要返回包括開始時間，但不包括結束時間
2.分析el-date-picker插件的v-model
假設當前我的插件爲如下代碼:
<el-date-picker
v-model="date"
value-format="yyyy-MM-dd"
type="daterange"
range-separator="-"
start-placeholder="開始日期"
end-placeholder="結束日期"
size="small">
</el-date-picker>
注：這裏date的定義爲getdate:[],定義爲getdate:'',無法實現
當選擇好一個時間後，在日誌裏打印這個date（console.log(this.date)）可以在控制檯看到如下數據：
可以看到插件綁定的對象date是一個數組，所以我們直接指定他的元素值就可以改變他顯示的時間了，需要注意的是，0號元素和1號元素必須同時設置，不然會導致控件不顯示時間
this.date[0]=this.startdate;
this.date[1]=this.enddate;
之前在網上看到很多文檔，大多數都要重寫一個方法，比較麻煩，懶人直接用這個方法就好了，兩行代碼簡單粗暴。
3.設置默認時間爲上一個月
直接貼代碼：
created: function () {
var now = new Date();
var year = now.getFullYear(); //得到當前年份
var month = now.getMonth(); //默認得到月份是上一個月，如果當前是3月，這個值爲2月
if(month ==12) //如果當前是1月，則獲取到的數據爲12月，年份減一
year=year -1;
var nextMonth=month+1;//其實就是當前月份
month = month.toString().padStart(2, "0"); //當小於10時，顯示爲01.02.03
nextMonth = nextMonth.toString().padStart(2, "0");
this.startdate = `${year}-${month}-01`;//拼接日期
this.enddate = `${year}-${nextMonth}-01`;
console.log(this.startdate+" "+this.enddate );
this.date[0]=this.startdate;
this.date[1]=this.enddate;
this.queryData();//調用方法查詢指定時間段內的數據
}
註釋裏都已說清代碼具體含義，方法比較簡單粗暴，如果有更好的方法歡迎一起討論