Fix <Modal>
scroll event handler
This commit is contained in:
parent
a68e3a6d20
commit
7937280971
2 changed files with 16 additions and 4 deletions
|
@ -38,6 +38,7 @@ export function Modal({
|
|||
theme,
|
||||
}: Readonly<PropsType>): ReactElement {
|
||||
const modalRef = useRef<HTMLDivElement | null>(null);
|
||||
const bodyRef = useRef<HTMLDivElement | null>(null);
|
||||
const [scrolled, setScrolled] = useState(false);
|
||||
const [hasOverflow, setHasOverflow] = useState(false);
|
||||
|
||||
|
@ -107,10 +108,14 @@ export function Modal({
|
|||
? getClassName('__body--overflow')
|
||||
: null
|
||||
)}
|
||||
onScroll={event => {
|
||||
setScrolled((event.target as HTMLDivElement).scrollTop > 2);
|
||||
onScroll={() => {
|
||||
const scrollTop = bodyRef.current?.scrollTop || 0;
|
||||
setScrolled(scrollTop > 2);
|
||||
}}
|
||||
ref={bodyEl => {
|
||||
measureRef(bodyEl);
|
||||
bodyRef.current = bodyEl;
|
||||
}}
|
||||
ref={measureRef}
|
||||
>
|
||||
{children}
|
||||
</div>
|
||||
|
|
|
@ -12659,6 +12659,13 @@
|
|||
"reasonCategory": "usageTrusted",
|
||||
"updated": "2021-08-05T00:22:31.660Z"
|
||||
},
|
||||
{
|
||||
"rule": "React-useRef",
|
||||
"path": "ts/components/Modal.tsx",
|
||||
"line": " const bodyRef = useRef<HTMLDivElement | null>(null);",
|
||||
"reasonCategory": "usageTrusted",
|
||||
"updated": "2021-09-21T01:40:08.534Z"
|
||||
},
|
||||
{
|
||||
"rule": "React-useRef",
|
||||
"path": "ts/components/ProfileEditor.tsx",
|
||||
|
@ -14367,4 +14374,4 @@
|
|||
"reasonCategory": "usageTrusted",
|
||||
"updated": "2021-09-17T21:02:59.414Z"
|
||||
}
|
||||
]
|
||||
]
|
Loading…
Reference in a new issue