ant-design / ant-design/pro-components

🐛[BUG]ProLayout 首屏 padding 抖动

Open
#8,712 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
4.8k
Forks
1.4k
Avg merge
10h 44m
Merged PRs (30d)
3

Description

提问前先看看:

https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/main/README-zh_CN.md

### 🐛 bug 描述

页面刚加载 ProLayout 是有 padding 的,然后一瞬间 padding 又没了,导致页面布局会抖动

### 📷 复现步骤

-

### 🏞 期望结果
-

### 💻 复现代码

看源码,是在这个 class 上设置 padding 为 0 的。因为 hasPageContainer 一开始是为 0 的,所以一开始有 padding,而后又大于 0 了,所以立马 padding 就没了。
![image](https://github.com/user-attachments/assets/745dcab6-6164-4c06-9b7d-3936e81593bb)

![image](https://github.com/user-attachments/assets/23d85ea5-39dd-4845-a775-9a2ffbad326f)

没有再研究下去这个多标签页有什么关系了

### © 版本信息

- ProComponents 版本: [e.g. 4.0.0]
- umi 版本
- 浏览器环境
- 开发环境 [e.g. mac OS]

### 🚑 其他信息

Contributor guide

Open the contributing guide

Research direction

Start by inspecting the ProLayout source and the class described in the report, focusing on how hasPageContainer changes during initial rendering. Reproduce the first-load padding transition in a minimal example and investigate its relationship to multi-tab pages. Done means the initial and settled padding remain stable without a visible layout shift.

Written by the indexing model from the issue text.

Assessment

Tech stack
react, typescript
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.