mirror of
https://github.com/facebook/docusaurus.git
synced 2025-06-13 16:23:34 +02:00
fix(theme-common): fix issue in tab scroll position restoration on tab click (#8628)
This commit is contained in:
parent
faadfad30d
commit
50d6d1e56b
3 changed files with 34 additions and 3 deletions
|
@ -222,7 +222,10 @@ export function useScrollPositionBlocker(): {
|
|||
);
|
||||
|
||||
useLayoutEffect(() => {
|
||||
nextLayoutEffectCallbackRef.current?.();
|
||||
// Queuing permits to restore scroll position after all useLayoutEffect
|
||||
// have run, and yet preserve the sync nature of the scroll restoration
|
||||
// See https://github.com/facebook/docusaurus/issues/8625
|
||||
queueMicrotask(() => nextLayoutEffectCallbackRef.current?.());
|
||||
});
|
||||
|
||||
return {
|
||||
|
|
|
@ -8,11 +8,11 @@
|
|||
import React, {
|
||||
isValidElement,
|
||||
useCallback,
|
||||
useEffect,
|
||||
useState,
|
||||
useMemo,
|
||||
type ReactNode,
|
||||
type ReactElement,
|
||||
useLayoutEffect,
|
||||
} from 'react';
|
||||
import {useHistory} from '@docusaurus/router';
|
||||
import {useQueryStringValue} from '@docusaurus/theme-common/internal';
|
||||
|
@ -246,7 +246,9 @@ export function useTabs(props: TabsProps): {
|
|||
}
|
||||
return value;
|
||||
})();
|
||||
useEffect(() => {
|
||||
// Sync in a layout/sync effect is important, for useScrollPositionBlocker
|
||||
// See https://github.com/facebook/docusaurus/issues/8625
|
||||
useLayoutEffect(() => {
|
||||
if (valueToSync) {
|
||||
setSelectedValue(valueToSync);
|
||||
}
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue