修复切换query进度条不消失
This commit is contained in:
parent
386a28709f
commit
b7579c5947
@ -8,10 +8,11 @@ import {
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
Suspense,
|
||||
type MutableRefObject,
|
||||
type ReactNode,
|
||||
} from "react";
|
||||
import { usePathname } from "next/navigation";
|
||||
import { usePathname, useSearchParams } from "next/navigation";
|
||||
|
||||
const SHOW_DELAY_MS = 120;
|
||||
const MIN_VISIBLE_MS = 180;
|
||||
@ -32,12 +33,22 @@ function clearTimer(timerRef: MutableRefObject<number | null>) {
|
||||
}
|
||||
}
|
||||
|
||||
function NavigationProgressComplete({ onComplete }: { onComplete: () => void }) {
|
||||
const pathname = usePathname();
|
||||
const searchParams = useSearchParams();
|
||||
|
||||
useEffect(() => {
|
||||
onComplete();
|
||||
}, [pathname, searchParams, onComplete]);
|
||||
|
||||
return null;
|
||||
}
|
||||
|
||||
export function NavigationProgressProvider({
|
||||
children,
|
||||
}: {
|
||||
children: ReactNode;
|
||||
}) {
|
||||
const pathname = usePathname();
|
||||
const [visible, setVisible] = useState(false);
|
||||
const visibleRef = useRef(false);
|
||||
const shownAtRef = useRef(0);
|
||||
@ -93,10 +104,6 @@ export function NavigationProgressProvider({
|
||||
}, remainingVisibleMs);
|
||||
}, [setProgressVisible]);
|
||||
|
||||
useEffect(() => {
|
||||
endNavigationProgress();
|
||||
}, [pathname, endNavigationProgress]);
|
||||
|
||||
useEffect(() => {
|
||||
function handleDocumentClick(event: MouseEvent) {
|
||||
if (
|
||||
@ -181,6 +188,9 @@ export function NavigationProgressProvider({
|
||||
return (
|
||||
<NavigationProgressContext.Provider value={contextValue}>
|
||||
{children}
|
||||
<Suspense fallback={null}>
|
||||
<NavigationProgressComplete onComplete={endNavigationProgress} />
|
||||
</Suspense>
|
||||
<div
|
||||
aria-live="polite"
|
||||
className={`pointer-events-none fixed inset-x-0 top-0 z-[100] transition-opacity duration-150 ${
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user