mirror of
https://github.com/vercel/next.js.git
synced 2026-09-20 02:25:18 +08:00
Hendrik Liebau
4b66771895
The `legacyBehavior` prop of the `Link` component has been deprecated since #77473. For Next.js 16, we're finally removing support for it. Consequently, we're also removing support for the `passHref` prop, which was only useful in conjunction with the `legacyBehavior` prop. A [codemod is available](https://nextjs.org/docs/app/guides/upgrading/codemods#new-link) to help you automatically upgrade your codebase. reverts #77473 --------- Co-authored-by: Sebastian Sebbie Silbermann <sebastian.silbermann@vercel.com>
43 lines
1.0 KiB
TypeScript
43 lines
1.0 KiB
TypeScript
import Link from "next/link";
|
|
import { useRouter } from "next/router";
|
|
|
|
export default function Nav() {
|
|
const router = useRouter();
|
|
return (
|
|
<div className="root">
|
|
<h2>Default</h2>
|
|
<p>
|
|
Automatically prefetch pages in the background as soon the Link appears
|
|
in the view:
|
|
</p>
|
|
<Link href="/">Home</Link> <Link href="/features">Features</Link>
|
|
<h2>Imperative</h2>
|
|
<p>Prefetch on onMouseEnter or on other events:</p>
|
|
<Link
|
|
prefetch={false}
|
|
href="/about"
|
|
onMouseEnter={() => {
|
|
router.prefetch("/about");
|
|
console.log("prefetching /about!");
|
|
}}
|
|
>
|
|
About
|
|
</Link>
|
|
<h2>Disable</h2>
|
|
<p>Disable prefetching</p>
|
|
<Link prefetch={false} href="/contact">
|
|
Contact
|
|
</Link>
|
|
<style jsx>{`
|
|
.root {
|
|
border-bottom: 1px solid grey;
|
|
padding-bottom: 8px;
|
|
}
|
|
a {
|
|
margin-right: 10px;
|
|
}
|
|
`}</style>
|
|
</div>
|
|
);
|
|
}
|