diff --git a/src/calendar/components/Month.js b/src/calendar/components/Month.js index 63a0b9abc..9a6508a00 100644 --- a/src/calendar/components/Month.js +++ b/src/calendar/components/Month.js @@ -4,7 +4,6 @@ import { t, bem, compareDay, - ROW_HEIGHT, getPrevDay, getNextDay, formatMonthTitle, @@ -27,6 +26,7 @@ export default createComponent({ currentDate: [Date, Array], allowSameDay: Boolean, showSubtitle: Boolean, + realRowHeight: Number, showMonthTitle: Boolean, firstDayOfWeek: Number, }, @@ -43,9 +43,7 @@ export default createComponent({ }, rowHeightWithUnit() { - if (this.rowHeight !== ROW_HEIGHT) { - return addUnit(this.rowHeight); - } + return addUnit(this.rowHeight); }, offset() { @@ -71,7 +69,7 @@ export default createComponent({ monthStyle() { if (!this.shouldRender) { const padding = - Math.ceil((this.totalDay + this.offset) / 7) * this.rowHeight; + Math.ceil((this.totalDay + this.offset) / 7) * this.realRowHeight; return { paddingBottom: `${padding}px`, @@ -106,6 +104,23 @@ export default createComponent({ }, }, + watch: { + shouldRender(value) { + if (value) { + this.$nextTick(() => { + if (this.$refs.day[0] && !this.realRowHeight) { + const { height } = this.$refs.day[0].getBoundingClientRect(); + this.$emit('update-height', height); + } + }); + } + }, + + realRowHeight() { + this.height = null; + }, + }, + methods: { getHeight() { if (!this.height) { @@ -289,6 +304,8 @@ export default createComponent({ if (type === 'selected') { return (
); }, diff --git a/src/calendar/test/__snapshots__/demo.spec.js.snap b/src/calendar/test/__snapshots__/demo.spec.js.snap index 2e5ac8a76..b0a56dda3 100644 --- a/src/calendar/test/__snapshots__/demo.spec.js.snap +++ b/src/calendar/test/__snapshots__/demo.spec.js.snap @@ -64,7 +64,7 @@ exports[`renders demo correctly 1`] = `