Open kabeep opened 1 year ago
我不确定 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) 。
calc(100% - ${scrollbarSize}px)
updateCSS( ` html body { overflow-y: hidden; ${isOverflow ? `width: calc(100% - ${scrollbarSize}px);` : ''} }`, id, )
从结果上来看似乎 Portal 的代码不需要判断盒子容器中的水平内容溢出?毕竟没有同样的设置 height 属性的值。 rc-util 这段代码看起来很久没更新了,同时阅读 antd 和 rc 的多个仓库代码时比较容易有歧义。
我不确定 switchScrollingEffect 是不是存在问题,或是有其他的考量,至少看起来是存在问题的。
在其他仓库中也能找到同样的函数,例如 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)
。从结果上来看似乎 Portal 的代码不需要判断盒子容器中的水平内容溢出?毕竟没有同样的设置 height 属性的值。 rc-util 这段代码看起来很久没更新了,同时阅读 antd 和 rc 的多个仓库代码时比较容易有歧义。