shallow routing

Yeeeeeun_IT·2022년 8월 25일
0

shallow routing

라우팅은 페이지 이동을 말한다.
next/router 의 자세한 내용은 아래 링크로 :)
https://nextjs.org/docs/api-reference/next/router

shallow routing (얕은 라우팅)은 라우팅의 한 방식으로
routing 시 shallow 옵션을 true 로 해주면 새로고침 없이 url만 바뀐다.
이는 불필요한 렌더를 예방한다.

import { useEffect } from 'react'
import { useRouter } from 'next/router'
// Current URL is '/'
function Page() {
  const router = useRouter()
useEffect(() => {
    // Always do navigations after the first render
    router.push('/?counter=10', undefined, { shallow: true })
  }, [])
  useEffect(() => {
    // The counter changed!
  }, [router.query.counter])
}
export default Page

출처: https://nextjs.org/docs/routing/shallow-routing

profile
🍎 The journey is the reward.

0개의 댓글