elementui日期选择，如何设置当天后的日期不能被点击；及默认展示日期效果

< div class= "block" size= "small">

< el-date-picker

v-model="value7"

type= "daterange"

align= "left"

format= "yyyy/MM/dd"

size= "small"

unlink-panels

range-separator= "至"

start-placeholder= "开始日期"

end-placeholder= "结束日期"

:picker-options="pickerOptions2">

</ el-date-picker>

</ div>

首先你得把这段代码复制到你的html中

然后再导入这段代码

pickerOptions2: {

disabledDate( time) {

return time. getTime() > Date. now(); 这里就是设置当天后的日期不能被点击

},

shortcuts: [

{

text: "最近一周",

onClick( picker) {

const end = new Date();

const start = new Date();

start. setTime(start. getTime() - 3600 * 1000 * 24 * 7);

picker. $emit( "pick", [start, end]);

}

},

{

text: "最近一个月",

onClick( picker) {

const end = new Date();

const start = new Date();

start. setTime(start. getTime() - 3600 * 1000 * 24 * 30);

picker. $emit( "pick", [start, end]);

}

},

{

text: "最近二个月",

onClick( picker) {

const end = new Date();

const start = new Date();

start. setTime(start. getTime() - 3600 * 1000 * 24 * 60);

picker. $emit( "pick", [start, end]);

}

}

]

},

value6: "",

// value7:""

value7: []

};

然后再methods中写一个以下的方法  在created中调用该方法  

startTime() {

let now = new Date();

let startDate = new Date(

Date. UTC(now. getFullYear(), now. getMonth(), now. getDate() - 7)

)

. toISOString()

. slice( 0, 10);

let endDate = new Date(

Date. UTC(now. getFullYear(), now. getMonth(), now. getDate())

)

. toISOString()

. slice( 0, 10);

this.value7 = [];

this.value7. push(startDate);

this.value7. push(endDate);

},

这样就完成了，这样的效果，网页一打开默认显示当天日期的前七天，如果想要设置更久，在方法中也可以改，相信你可以找到在哪里改的