(1)html元素
<span class="f14">{{date_choose}}</span>
<van-calendar v-model="date_choose_show" :min- date="minDate" @confirm="date_Confirm"></van-calendar>
(2)data数据
// 页面日历选择默认值
date_choose: '',
// 页面日历选择弹出层
date_choose_show: false,
minDate: new Date(2010, 0, 1),
(3)create
created() {
//初始化日期
this.getToday();
},
(4)methods
methods: {
//获取今天的日期
getToday: function () {
let date_choose = new Date();
this.date_choose = date_choose.getMonth() + 1 + '月' + date_choose.getDate() + '日';
},
// 页面日历格式化
formatDate: function (date) {
return `${date.getMonth() + 1}/${date.getDate()}`;
},
// 页面日历确认事件
date_Confirm: function (date) {
this.date_choose_show = false;
this.date_choose = this.formatDate(date);
},
},