需求:
默认展示当年当月的数据
只允许选择2020年至2022年内的月份,早于2020年,或者大于2022年禁止选择
********* 模板内容 *********
<DatePicker
transfer
:options="forbidDate"
@on-change="handleChange"
v-model="currentMonth"
format="yyyy-MM"
type="month"
placeholder="请选择日期"
style="width: 200px" />
********* data内数据 *********
currentMonth: '', // 当前月份
forbidDate:{
disabledDate(date){
const disabledDate = date.getFullYear()
return ( disabledDate < 2020 || disabledDate > 2022 )
}
}
*********** js ***********
mounted() {
this.init()
},
methods: {
init() {
this.getCurrentYear()
},
// 获取当前年月份
getCurrentYear() {
let date = new Date();
let year = date.getFullYear();
let month = date.getMonth() + 1;
this.currentMonth = `${year}/${month}`
},
handleChange(date){
this.currentMonth = date
},
},
展示效果: