switchScrollingEffect.js 的代码是否存在问题？
Nessuno ha ancora preso questa issue.
Valutazione
- Difficoltà
- 4/5
- Tempo stimato
- 3-5 giorni
- Idoneità per principianti
- 35/100
- Tipo di issue
- Bug
- Chiarezza
- Da chiarire
- Stato di attività
- Ferma
- Stack tecnologico
- javascript, typescript
Direzione di ricerca
Inizia da src/switchScrollingEffect.js e confronta la logica di isBodyOverflowing con quella di src/util.ts e src/useScrollLocker.tsx in rc-portal, prestando particolare attenzione alle condizioni overflow-y e width. Traccia dove viene utilizzato l’helper di rc-util, quindi stabilisci il comportamento previsto per l’overflow orizzontale e verticale; il lavoro è completato quando il comportamento è stato chiarito e l’implementazione o la documentazione pertinente è allineata.
Scritto dal modello di indicizzazione a partire dal testo della issue.
Descrizione
我不确定 switchScrollingEffect 是不是存在问题，或是有其他的考量，至少看起来是存在问题的。
function isBodyOverflowing() {
// 这里的判断需要窗口的横纵同时溢出才为 True
return (
document.body.scrollHeight >
(window.innerHeight || document.documentElement.clientHeight) &&
window.innerWidth > document.body.offsetWidth
);
}
在其他仓库中也能找到同样的函数，例如 Portal 。
rc-util 的 switchScrollingEffect 似乎在 react-component/* 或 ant-design/ant-design/* 中没有被使用，并且它在 rc-util 中如果横纵有一方未溢出，无论另一方是否溢出都不会使不该被允许滚动的窗口仍允许滚动。
在 Portal 的 useScrollLocked.tsx 中，最新的代码会在任何场景下生效 overflow-y: hidden ，只有内容在窗口横纵都溢出的时候才对 body 与 html 设置 width: calc(100% - ${scrollbarSize}px) 。
updateCSS(
`
html body {
overflow-y: hidden;
${isOverflow ? `width: calc(100% - ${scrollbarSize}px);` : ''}
}`,
id,
)
从结果上来看似乎 Portal 的代码不需要判断盒子容器中的水平内容溢出？毕竟没有同样的设置 height 属性的值。
rc-util 这段代码看起来很久没更新了，同时阅读 antd 和 rc 的多个仓库代码时比较容易有歧义。
| Environment | Info |
|---|---|
| rc-util | 5.30.0 |
| rc-portal | 1.1.1 |
- Lingua principale
- TypeScript
- Stelle
- 670
- Fork
- 205
- Merge medio
- 14g 12h
- PR unite (30g)
- 3
Preparare l'ambiente
Non abbiamo ancora controllato i file di configurazione di questo progetto. Parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.
Come iniziare
- Leggi tutta la issue e poi la guida ai contributi del progetto.
- Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
- Fai un fork del repository e lavora su un branch.
- Apri una pull request che faccia riferimento al numero della issue.
Altre issue di react-component/util
-
Difficoltà 2/5 1-3 ore Idoneità per principianti 88/100
react-component/util#816 ·
-
injectCSS method not attaching csp nonce passed to it. it is used in antd components internallyAperta
Difficoltà 2/5 1-3 ore Idoneità per principianti 65/100
react-component/util#671 · 1 commento ·
-
Difficoltà 4/5 3-5 giorni Idoneità per principianti 35/100
react-component/util#738 · 1 commento · 1 reazione ·
-
Difficoltà 4/5 3-5 giorni Idoneità per principianti 25/100
react-component/util#710 ·
-
Difficoltà 3/5 1-2 giorni Idoneità per principianti 25/100
react-component/util#647 · 5 commenti ·
Tutte le issue di react-component/util
Issue simili
-
triage
Difficoltà 1/5 Meno di un'ora Idoneità per principianti 90/100
I maintainer di solito rispondono entro 1 giorno
-
bug
Difficoltà 2/5 1-3 ore Idoneità per principianti 68/100
mermaid-js/mermaid-live-editor#2053 ·
I maintainer di solito rispondono entro 1 giorno
-
factory
Difficoltà 2/5 1-3 ore Idoneità per principianti 82/100
jessepollak/home#1455 ·
I maintainer di solito rispondono entro 1 giorno
-
community first-timers-only good first issue hacktoberfest help wanted low hanging fruit up-for-grabs
Difficoltà 1/5 Meno di un'ora Idoneità per principianti 95/100
lingdojo/kana-dojo#31227 · 1 commento · 5 reazioni ·
I maintainer di solito rispondono entro 1 giorno
-
mobile: device viewer shows dark status bar icons on its dark backdrop in light mode (Android)Aperta
Difficoltà 1/5 Meno di un'ora Idoneità per principianti 92/100
appandflow/stim#1838 ·
I maintainer di solito rispondono entro 1 giorno