رفرش کامل صفحه بعد از کلیک روی تگ لینک در nextjs

رفرش کامل صفحه بعد از کلیک روی تگ لینک در nextjs

تگ <Link> در nextjs در واقع جهت نمایش یک لینک در صفحات موجود در این فریم‌ورک استفاده می‌شود. یکی از ویژگی‌های این تگ این است که نیاز نیست کل صفحه مجددا بارگزاری شود و تنها یک بخش کوچک را تغییر دهد. در این بین، بعضی از لینک‌ها هستند که بعد از کلیک روی آن‌ها نیاز به رفرش کامل صفحه نیاز است.

رفرش کامل صفحه بعد از کلیک روی تگ لینک در nextjs

برای این کار کافیست در تگ <Link> مورد نظرتان ویژگی as={router.asPath} را اضافه کنید.

به نمونه‌ی زیر دقت کنید:

// imports
import Link from 'next/link';
import { useRouter } from 'next/router';

// in componenet body
const router = useRouter();

// link tag
<Link href="/current-page" as={router.asPath}>
  <a>Click me</a>
</Link>

اگر نیاز به آموزشی‌های بیش‌تری از nextjs دارید در بخش نظرات همین نوشته برای ما بنویسید.