封装日历uniapp，只显示年月不显示日

默认展示最新日期

子组件

<template>
	<view class="date-picker">
		<picker mode="date" fields="month" @change="onDateChange" :value="selectedDate">
			<view class="picker">
				{{ selectedDate }}
				<u-icon name="arrow-down-fill" size="12"></u-icon>
			</view>
		</picker>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				selectedDate: ''
			};
		},
		created() {
			const now = new Date();
			const year = now.getFullYear();
			const month = (now.getMonth() + 1).toString().padStart(2, '0');
			this.selectedDate = `${year}-${month}`;
		},
		methods: {
			onDateChange(event) {
				console.log('11111111111');
				this.selectedDate = event.detail.value;
				this.$emit('updateDate', this.selectedDate);

			}
		}
	};
</script>

<style lang="scss">
	.date-picker {
		display: flex;
		justify-content: center;
		align-items: center;
		font-size: 26rpx;
		width: 200rpx;
		height: 64rpx;
		line-height: 64rpx;
	}

	.picker {
		display: flex;

	}

	/deep/.u-icon__icon.data-v-172979f2 {
		margin-left: 8rpx !important;
	}
</style>

父组件

<script>
import YearMonthPicker from '@/components/YearMonthPicker.vue'; // 修改路径为实际路径

export default {
  components: {
    YearMonthPicker
  },
  data() {
    return {
      selectedDate: ''
    };
  },
  methods: {
    updateDate(date) {
      this.selectedDate = date;
    },
  }
};
</script>