зеркало из https://github.com/github/docs.git
38 строки
1.5 KiB
TypeScript
38 строки
1.5 KiB
TypeScript
import { useRouter } from 'next/router'
|
|
import useSWR from 'swr'
|
|
|
|
// This component is never mounted when you're in production mode.
|
|
// Only when running in `NODE_ENV==='development'`.
|
|
// It will reload the content every time the current page is focussed
|
|
// (from being not focussed).
|
|
export default function ClientSideRefresh() {
|
|
const router = useRouter()
|
|
|
|
useSWR(
|
|
router.asPath,
|
|
() => {
|
|
// Remember, in NextJS, the `router.locale` is never including the
|
|
// `router.asPath`. So we have to make sure it's always there
|
|
// otherwise, after this hook runs, you lose that `/en` prefix
|
|
// in the URL on the address bar.
|
|
router.replace(`/${router.locale}${router.asPath}`, undefined, { scroll: false })
|
|
},
|
|
{
|
|
// Implied here is that `revalidateOnFocus: true` which the default
|
|
// and it means that the `useSWR` hook will make a listener on the
|
|
// the Page Visibility API.
|
|
// https://developer.mozilla.org/en-US/docs/Web/API/Page_Visibility_API
|
|
// It effectly means that the callback of this hook will run every
|
|
// time the browser window is put back to being visible.
|
|
|
|
// The `revalidateOnMount` is crucial because it means that we don't
|
|
// bother executing the hook callback when it was first mounted
|
|
// because, naturally, the first time you mount it, it will not
|
|
// need to refresh because it's as fresh as it gets already.
|
|
revalidateOnMount: false,
|
|
}
|
|
)
|
|
|
|
return null
|
|
}
|