FatttSnake/oxygen-ui
1
0
Fork 0
Code Pull Requests Activity

Fix HideScrollbar

Browse Source
This commit is contained in:
Fat Snake
2023-10-12 23:26:10 +08:00
parent ac3c1dbc2c
commit 36b5acfea9
1 changed files with 5 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
src/components/common/HideScrollbar.tsx
View File

@@ -139,6 +139,7 @@ const HideScrollbar = forwardRef<HideScrollbarElement, HideScrollbarProps>((prop
const lastScrollbarClickPositionRef = useRef({ x: -1, y: -1 }) const lastScrollbarClickPositionRef = useRef({ x: -1, y: -1 })
const lastScrollbarTouchPositionRef = useRef({ x: -1, y: -1 }) const lastScrollbarTouchPositionRef = useRef({ x: -1, y: -1 })
const lastTouchPositionRef = useRef({ x: -1, y: -1 }) const lastTouchPositionRef = useRef({ x: -1, y: -1 })
const [verticalScrollbarWidth, setVerticalScrollbarWidth] = useState(0)
const [verticalScrollbarLength, setVerticalScrollbarLength] = useState(100) const [verticalScrollbarLength, setVerticalScrollbarLength] = useState(100)
const [verticalScrollbarPosition, setVerticalScrollbarPosition] = useState(0) const [verticalScrollbarPosition, setVerticalScrollbarPosition] = useState(0)
const [verticalScrollbarOnClick, setVerticalScrollbarOnClick] = useState(false) const [verticalScrollbarOnClick, setVerticalScrollbarOnClick] = useState(false)
@@ -366,6 +367,9 @@ const HideScrollbar = forwardRef<HideScrollbarElement, HideScrollbarProps>((prop
useEffect(() => { useEffect(() => {
const windowResizeListener = () => { const windowResizeListener = () => {
setVerticalScrollbarWidth(
(rootRef.current?.offsetWidth ?? 0) - (rootRef.current?.clientWidth ?? 0)
)
setHorizontalScrollbarWidth( setHorizontalScrollbarWidth(
(rootRef.current?.offsetHeight ?? 0) - (rootRef.current?.clientHeight ?? 0) (rootRef.current?.offsetHeight ?? 0) - (rootRef.current?.clientHeight ?? 0)
) )
@@ -455,6 +459,7 @@ const HideScrollbar = forwardRef<HideScrollbarElement, HideScrollbarProps>((prop
className={'hide-scrollbar-selection'} className={'hide-scrollbar-selection'}
tabIndex={0} tabIndex={0}
style={{ style={{
width: `calc(100vw + ${verticalScrollbarWidth}px)`,
height: `calc(100vh + ${horizontalScrollbarWidth}px)`, height: `calc(100vh + ${horizontalScrollbarWidth}px)`,
touchAction: isPreventAnyScroll ? 'none' : '', touchAction: isPreventAnyScroll ? 'none' : '',
msTouchAction: isPreventAnyScroll ? 'none' : '' msTouchAction: isPreventAnyScroll ? 'none' : ''