Microsoft Student (2023)728x90
728x90
<Link> 컴포넌트 클릭 시, 최상단으로 스크롤 되는 현상 막는 방법
들어가며
- Next.js의
<Link>컴포넌트를 클릭하면, 기본적으로 화면의 최상단으로 스크롤이 된다. - 이러한 현상을 막는 방법을 정리해본다.
방법
- 간단하다. 다음과 같이
<Link>컴포넌트의scroll속성의 값을false로 지정해주면 된다.
import Link from 'next/link'; <Link href='/myRoute' scroll={false}> Move </Link>
참고 사이트
Components: <Link> | Next.js
Enable fast client-side navigation with the built-in component.
nextjs.org
728x90
728x90
'Framework > Next.js' 카테고리의 다른 글
| [Next.js] Hydration 에러 해결하는 방법 (Next.js 15) (0) | 2024.11.21 |
|---|---|
| [Next.js] 렌더링 방식 정리 (CSR(Client Side Rendering), SSR(Server Side Rendering), SSG(Static Site Generation), ISR(Incremental Static Regeneration)) (14) | 2024.11.14 |
| [Next.js] 테마 토글 기능 설정하기 (with shadcn/ui) (0) | 2024.11.05 |
| [Next.js] 갑자기 "'next'은(는) 내부 또는 외부 명령, 실행할 수 있는 프로그램, 또는배치 파일이 아닙니다." 오류가 발생할 때 해결 방법 (0) | 2024.10.30 |
| [Next.js] 환경 변수 사용 방법 (1) | 2024.10.29 |
| [Next.js] 폴더 구조 및 동적 경로 설정하기 (0) | 2024.10.16 |
| [Next.js] 정적 생성(Static Generation)과 서버사이드 렌더링(Server-side Rendering) (0) | 2024.08.08 |
| [Next.js] 메타데이터(Metadata) 추가하기 (0) | 2024.08.07 |