Element UI -- el-date-picker 日期組件設置默認值

最近有需求，列表查詢條件的日期組件自動展示前一周到今天的日期。做個小記。廢話不多說，直接上代碼。

html:

<el-date-picker
         style="width:23%" 
         v-model="time"
         type="daterange"
         range-separator="至"
         start-placeholder="開始日期"
         end-placeholder="結束日期"
         value-format="yyyy-MM-dd"
></el-date-picker>

js：計算屬性

 computed: {
        // 默認時間
        timeDefault () {
            let date = new Date()
            // 通過時間戳計算
            let defalutStartTime = date.getTime() - 7 * 24 * 3600 * 1000 // 轉化為時間戳
            let defalutEndTime = date.getTime()
            let startDateNs = new Date(defalutStartTime) 
            let endDateNs = new Date(defalutEndTime)
            // 月，日 不夠10補0
            defalutStartTime = startDateNs.getFullYear() + '-' + ((startDateNs.getMonth() + 1) >= 10 ? (startDateNs.getMonth() + 1) : '0' + (startDateNs.getMonth() + 1)) + '-' + (startDateNs.getDate() >= 10 ? startDateNs.getDate() : '0' + startDateNs.getDate())
            defalutEndTime = endDateNs.getFullYear() + '-' + ((endDateNs.getMonth() + 1) >= 10 ? (endDateNs.getMonth() + 1) : '0' + (endDateNs.getMonth() + 1)) + '-' + (endDateNs.getDate() >= 10 ? endDateNs.getDate() : '0' + endDateNs.getDate())
            return [defalutStartTime, defalutEndTime]
        }
    },

created生命周期里直接賦值

    created(){
        this.time = this.timeDefault;
    },

以上即可。