uni-app开始时间结束时间(结束时间大于开始时间)picker编写

利用uni-app官网里面picker插件代码,点击开始时间后结束时间要大于选择后的开始时间,点击结束时间后开始时间要小于开始时间。

html代码


	
		
			开始时间
			
				
					{{start_date}}
				
			
		
		
			结束时间
			
				
					{{other}}
				
			
		
	

js代码

export default {
	data() {
		const currentDate = this.getDate({
			format: true
		})
		return {
			start_date: currentDate,
			end_date: currentDate,
			other:'请输入'
		}
	},
	computed: {
		
	},
	methods: {
		// 选择日期
		bindDateChange: function(e) {
			this.start_date = e.target.value
			
		},
		bindDateChange2: function(e) {
			this.end_date = e.target.value;
			this.other = this.end_date;
		},
		// 获取当前时间
		getDate(type) {
			const date = new Date();
			let year = date.getFullYear();
			let month = date.getMonth() + 1;
			let day = date.getDate();
		
			if (type === 'start') {
				year = year - 60;
			} else if (type === 'end') {
				year = year + 2;
			}
			month = month > 9 ? month : '0' + month;;
			day = day > 9 ? day : '0' + day;
			return `${year}-${month}-${day}`;
		},
	}
}

css代码

.leave_cont .ul{
	padding-left: 30rpx;
}
.leave_cont .ul .li{
	display: flex;
	align-items: center;
	border-bottom: 1px solid #efefef;
}
.leave_cont .ul .li text{
	padding: 40rpx 0;
	font-size: 34rpx;
	font-family: '黑体';
}
.leave_cont .ul .li .flex1{
	flex: 1;
	text-align: right;
	padding-right: 25rpx;
	color: #999999;
	font-size: 32rpx;
}
.date{
	height: 42rpx;
}
(编写高质量代码,一个专业致力于页面转化,切图的前端爱好者~~)

你可能感兴趣的:(uni-app,picker)