amirho/react.dev
1
0
Fork 0
mirror of https://github.com/reactjs/react.dev.git synced 2026-02-22 03:42:14 +00:00
Code Issues Packages Projects Releases Wiki Activity

[Beta] Fix scroll jumps on navigating to fragments (#5375)

Browse Source
This commit is contained in:
dan
2022-12-17 14:14:54 +00:00
committed by GitHub
parent c4d2a6da45
commit 5385031b46
1 changed files with 5 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
beta/src/components/MDX/ExpandableExample.tsx
View File

@@ -28,20 +28,17 @@ function ExpandableExample({children, excerpt, type}: ExpandableExampleProps) {
const isExample = type === 'Example';
const id = children[0].props.id;
const queuedExpandRef = useRef<boolean>(true);
const {asPath} = useRouter();
// init as expanded to prevent flash
const [isExpanded, setIsExpanded] = useState(true);
const shouldAutoExpand = id === asPath.split('#')[1];
const queuedExpandRef = useRef<boolean>(shouldAutoExpand);
const [isExpanded, setIsExpanded] = useState(false);
// asPath would mismatch between server and client, reset here instead of put it into init state
useEffect(() => {
if (queuedExpandRef.current) {
queuedExpandRef.current = false;
if (id !== asPath.split('#')[1]) {
setIsExpanded(false);
}
setIsExpanded(true);
}
}, [asPath, id]);
}, []);
return (
<details