| 本文实例为大家分享了vue自定义可选时间日历组件的具体代码，供大家参考，具体内容如下 日历功能：1、过去时间不可选择
2、可自定义不可选时间
3、本月默认展示当天，其他月展示第一天，若为不可选时间，往后顺延
效果图：
-------下面开始表演----------- **首先，画出日历页面布局，参照win10系统日历布局*6行7列，为何如此，请自行理解…*本人也是“偷窥”来的 beginDay是当前月第一天的周几，prevMdays是上个月总天数，nowMdays是当月总天数，这样就实现了日历的展示效果，标签中绑入一些可能会用到的数据 data-dates等 <div class="dateContent-body-day" v-for="item in 42" :key="item"> <div v-if="item - beginDay > 0 && item - beginDay <= nowMdays" :class="{ 'active-day': `${year}/${month}/${item - beginDay}` == curDate }" @click="dayHandler" :data-year="year" :data-month="month" :data-day="item - beginDay" :data-dates="year + '/' + month + '/' + (item - beginDay)" > {{ item - beginDay }} </div> <div class="other-day" v-else-if="item - beginDay <= 0"> {{ item - beginDay + prevMdays }} </div> <div class="other-day" v-else>{{ item - beginDay - nowMdays }}</div></div>
微信小程序scroll-view实现上拉加载数据重复的解决方法
原生js实现简易计算器
|
