uniapp日期选择器

时间:2025-01-20 15:46:35

日期

在picker中加fields="month"就只能选择年月了,加fields="year"则只能选择年,默认是年月日格式

直接上代码,可以直接粘贴复制复用

<picker 
    mode="date" 
    :value="date" 
    fields="month" 
    :start="startDate" 
    :end="endDate"     
    @change="bindDateChange">
		<view>{{ date }}</view>
</picker>
<script>
function getDate(type) {
	const date = new Date();
	let year = ();
	let month = () + 1;
	let day = ();
	if (type === 'start') {
		year = year - 10;
	} else if (type === 'end') {
		year = year + 10;
	}
	month = month > 9 ? month : '0' + month;
	return `${year}-${month}`;
}
export default {
	data() {
		return {
			date: getDate({
				format: true
			}),
			startDate: getDate('start'),
			endDate: getDate('end'),
		};
	},
	methods: {
		bindDateChange(e) {
			 = (0, 7);
			 = ;
			 = 1;
			 = [];
			();
		},
	}
};
</script>

效果图

如果想要也显示每天的话把标签里的 fields="month" 删除即可,然后再在 getDate 里改变最后返回值即可 return `${year}-${month}-${day}`