uniapp_微信小程序_预约时间组件的使用

一、官方文档

DatetimePicker 选择器 | uView 2.0 - 全面兼容 nvue 的 uni-app 生态框架 - uni-app UI 框架 (uviewui.com)

 

二、完成的效果

 之前使用的是Calendar 日历 这个太耗性能了，直接页面卡顿，所以就换成以上选择器了

三、代码 

	<u-datetime-picker :show="showrili" v-model="value1" mode="date" @confirm="confirmrili"
			:minDate="datamiao"></u-datetime-picker>



value1: Number(new Date()),
				datamiao: null

 这个直接就显示出来了选择器

	confirmrili(e) {
				this.showrili = false
				// 给定的时间戳
				const timestamp = e.value; // 假设这是秒数
				// 创建一个Date对象，将时间戳转换为日期
				const date = new Date(timestamp);
				// 使用Date对象的方法提取年、月和日
				const year = date.getFullYear();
				const month = date.getMonth() + 1; // JavaScript中月份是从0开始计数的，所以需要加1
				const day = date.getDate();
				this.timerili = year + "-" + month + "-" + day


			},

这个就是把拿到的时间戳转换成年月日

	onLoad() {
			// 获取当前时间戳。预约时间为默认的今天
			const currentTimestamp = Date.now();
			this.datamiao = currentTimestamp

		},

获取当前时间戳赋值在预约时间的初始值