medical/conponents/Sever/timeSever2.vue

<template>
	<view>
		<view style="display: flex;" @click="itemShow = true">{{itemData}}<u-icon name="arrow-down" style="margin-left: 17rpx;"></u-icon></view>
		<u-calendar
			title=""
			:show="itemShow" 
			:defaultDate="defaultDateMultiple"
			mode="range" 
			@confirm="confirm"
			:closeOnClickOverlay="true"
			@close='cancel'
		></u-calendar>
		</u-calendar>
	</view>
</template>

<script>
	const d = new Date()
	const year = d.getFullYear()
	let month = d.getMonth() + 1
	month = month < 10 ? `0${month}` : month
	const date = d.getDate()
	let time = [`${year}-${month}-${date}`, `${year}-${month}-${date}`,]
	
	export default {
		data() {
			return {
				itemData: (`${year}-${month}-${date}` +' ~ ' + `${year}-${month}-${date}`), // 时间
				itemShow: false, // 时间选择器显隐
				defaultDateMultiple: time,
			}
		},
		methods: {
			confirm(e){
				console.log(e)
				this.itemData = e[0] + ' ~ ' + e[e.length -1]
				this.cancel()
			},
			
			// 关闭
			cancel(){
				this.itemShow = false
			},
			
		},
	}
</script>

<style lang="scss" scoped>
	.choice-left{
		float: left;
		overflow: hidden;
		display: flex;
		width: 250rpx;
	}
</style>