vant 日历 点击显示详情

html

    <p>点击日期查看详情</p>
    <van-calendar
            safe-area-inset-bottom
            :poppable="false" :show-confirm="false"
            :title="date" :show-subtitle="false"
            :default-date="null"
            :min-date="minDate" :max-date="maxDate"
            :formatter="formatter"
            :style="{ height: '400px' }"
            @select="goDetails">
    </van-calendar>

data数据
函数

            goDetails(date){//点击日历查看详情
                 var chooseDate = '';
                chooseDate = `${date.getFullYear()}年${date.getMonth() + 1}月${date.getDate()}日`;
                window.location.href = 'now.html?date=' + chooseDate;
            },
            formatter(day) {//日期显示小点
                const date = day.date.getDate();
                if(date===1 || date === 2){
                    day.className = 'point';
                }
                return day;
            },
posted @ 2020-11-25 10:32  JaneLifeVlog  阅读(1113)  评论(0)    收藏  举报