element ui 日期选择器 默认展示最近一个月的时间不能选择未来时间

最近用到element ui的日期选择器，把实现过程记录一下。（vue项目）
首先说下我的需求：
1、默认展示最近一个月的时间
2、不可以选择未来时间 效果如下

                       <template>
                            <div class="block">
                                <el-date-picker
                                        v-model="columnDateValue"
                                        type="daterange"
                                        format="yyyy-MM-dd"
                                        value-format="yyyy-MM-dd"
                                        range-separator="~"
                                        :default-value="Date.now() - 30 * 24 * 3600 * 1000"
                                        :picker-options="pickerOptions"
                                        start-placeholder="开始日期"
                                        end-placeholder="结束日期"
                                        @change="changeDate"
                                >
                                </el-date-picker>
                            </div>
                        </template>

以上做个解释
format="yyyy-MM-dd"和 value-format=“yyyy-MM-dd” 要写上 要规定好日期格式
:picker-options=“pickerOptions” 是为了不让选择今天之后的日期 对应的函数在data里
:default-value="Date.now() - 30 * 24 * 3600 * 1000"是为了让它默认不展示下一个月的日历
下图左图是没有加 :default-value之前的（当天是1月10号，展示1月和2月的日历） 右图是加了之后的

export default {
        data() {
            return {
                columnDateValue: [], // 因为我默认展示的是时间区间 所以定义一个数组
                pickerOptions: {
                    disabledDate(time) {
                        return time.getTime() > Date.now();
                    }
                }
            }
        },
        methods: {
        //changeDate 函数 是我绑定的change事件 用来执行获取数据api的函数的
            changeDate() {
                this.getApiBar('yvjing', 1)
            },
            //格式化时间 返回年月日 
            getDate(time) {
                   if (time) {
                     let val = new Date(time);
                     let Y = val.getFullYear();
                     let M = (val.getMonth() + 1) < 10 ? '0' + (val.getMonth() + 1) : (val.getMonth() + 1);
                     let D = val.getDate() < 10 ? '0' + val.getDate() : val.getDate();
                     let h = val.getHours() < 10 ? '0' + val.getHours() : val.getHours();
                     let m = val.getMinutes() < 10 ? '0' + val.getMinutes() : val.getMinutes();
                     return Y + '-' + M + '-' + D;
              }
            return ''
           }

        },
        mounted() {
            let nowTimes = Date.now();
            let oldTimes = nowTimes - (86400000 * 30);
            let oldDate = this.getDate(oldTimes); //一个月前的时间
            let nowDate = this.getDate(nowTimes);//今天的时间
            this.columnDateValue = [oldDate, nowDate];
        }
    }