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 `next/link` component.
nextjs.org
728x90
728x90
'Framework > Next.js' 카테고리의 다른 글
| [Next.js] Console Error Attempting to parse an unsupported color function "lab" 문제 해결 방법 (html2canvas) (0) | 2025.09.22 |
|---|---|
| [Next.js] Google Sheets API 연동 방법 (0) | 2025.07.06 |
| [Next.js] 같은 네트워크 망에 연결된 다른 컴퓨터에서 테스트 하는 방법 (0) | 2025.06.08 |
| [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 |