discounts-minapp/hotel/chooseDate.vue

<template>
	<view class="chooseDate">
		<u-calendar 
		        startText="住店"
		        endText="离店"
		        confirmDisabledText="请选择离店日期"
		        :formatter="formatter"
		        :show="show" 
		        :mode="mode" 
		        @confirm="confirm"
				ref="calendar"
			>
		    </u-calendar>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show: true,
				mode: 'range'
			}
		},
		onReady() {
			// 如果需要兼容微信小程序的话，需要用此写法
			this.$refs.calendar.setFormatter(this.formatter)
		},
		methods: {
			confirm(e) {
				console.log(e);
			},
			formatter(day) {
				const d = new Date()
				let month = d.getMonth() + 1
				const date = d.getDate()
				if(day.month == month && day.day == date + 3)
				{
					day.bottomInfo = '有优惠'
					day.dot = true
				}
				return day
			}
		}
	}
</script>

<style lang="scss" scoped>
.chooseDate{
	
}
</style>