fix: skip fixed footer height in auto-content-height calculation (#7910)
* fix: skip fixed footer height in auto-content-height calculation When the Page component's footer has position: fixed, it is removed from the normal document flow and should not be subtracted from the available content height. Previously, the footer's offsetHeight was always subtracted, causing incorrect height calculation for fixed footers. Also reset shouldAutoHeight before recalculating to prevent stale state on hot reload. Fixes #4576 * fix: replace getComputedStyle footer height check with footerFixed prop Use an explicit `footerFixed` boolean prop instead of runtime getComputedStyle detection to determine whether the footer height should be excluded from content height calculation. This avoids unreliable style queries and makes the behavior deterministic. Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com> --------- Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>master^2
parent
f55b18ffd7
commit
294700a247
|
|
@ -0,0 +1,5 @@
|
|||
---
|
||||
"@vben/common-ui": patch
|
||||
---
|
||||
|
||||
fix: skip fixed footer height in auto-content-height calculation
|
||||
|
|
@ -12,7 +12,7 @@ defineOptions({
|
|||
name: 'Page',
|
||||
});
|
||||
|
||||
const { autoContentHeight = false, heightOffset = 0 } =
|
||||
const { autoContentHeight = false, heightOffset = 0, footerFixed = false } =
|
||||
defineProps<PageProps>();
|
||||
|
||||
const headerHeight = ref(0);
|
||||
|
|
@ -36,9 +36,12 @@ async function calcContentHeight() {
|
|||
if (!autoContentHeight) {
|
||||
return;
|
||||
}
|
||||
shouldAutoHeight.value = false;
|
||||
await nextTick();
|
||||
headerHeight.value = headerRef.value?.offsetHeight || 0;
|
||||
footerHeight.value = footerRef.value?.offsetHeight || 0;
|
||||
|
||||
footerHeight.value = footerFixed ? 0 : (footerRef.value?.offsetHeight || 0);
|
||||
|
||||
setTimeout(() => {
|
||||
shouldAutoHeight.value = true;
|
||||
}, 30);
|
||||
|
|
|
|||
|
|
@ -14,4 +14,10 @@ export interface PageProps {
|
|||
* @default 0
|
||||
*/
|
||||
heightOffset?: number;
|
||||
/**
|
||||
* Whether the footer is position: fixed.
|
||||
* When true, footer height is excluded from content height calculation.
|
||||
* @default false
|
||||
*/
|
||||
footerFixed?: boolean;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue