onBeforeRouteLeave 컴포저블을 사용하면 구성요소 내에 경로 가드를 등록할 수 있다. onBeforeRouteLeave(leaveGuard): void 현재 위치의 컴포넌트가 떠날 때마다 트리거되는 탐색 가드를 추가한다. beforeRouteLeave와 유사하지만 모든 컴포넌트에서 사용할 수 있다. 컴포넌트가 마운트 해제되면 가드가 제거된다. 매개변수​ Name Type Description leaveGuard NavigationGuard NavigationGuard 반환값​ void

navigateTo는 프로그래밍 방식으로 사용자를 탐색하는 헬퍼 함수다. 서버 측과 클라이언트 측 모두에서 사용할 수 있다. 사용법 Vue 컴포넌트 내에서 라우트 미들웨어 내에서 export default defineNuxtRouteMiddleware((to, from) => { if (to.path !== '/search') { // setting the redirect code to '301 Moved Permanently' return navigateTo('/search', { redirectCode: 301 }) } }) 참고) Nuxt-Directory > middleware 외부 URL open() 사용 Type navigateTo(to: RouteLocationRaw | undefined |..

페이지 수준에서 하이브리드 렌더링을 위한 라우팅 규칙을 정의한다. 실험적인 기능으로 사용하려면 nuxt.config 에서 experimental.inlineRouteRules 옵션을 활성화해야 한다. 사용법 Hello world! 다음과 같다. export default defineNuxtConfig({ routeRules: { '/': { prerender: true } } })

페이지 구성 요소에 대한 메타데이터를 정의한다. definePageMeta은 pages/ 디렉토리에 있는 페이지 컴포넌트에 대한 메타데이터를 설정하는 데 사용할 수 있는 컴파일러 매크로이다. 이 방법으로 Nuxt 애플리케이션의 각 정적 또는 동적 경로에 대한 사용자 정의 메타데이터를 설정할 수 있다. Type definePageMeta(meta: PageMeta) => void interface PageMeta { validate?: (route: RouteLocationNormalized) => boolean | Promise | Partial | Promise redirect?: RouteRecordRedirectOption name?: string path?: string alias?: string..

defineNuxtRouteMiddleware 헬퍼 함수를 사용하여 명명된 경로 미들웨어를 만든다. 경로 미들웨어는 Nuxt 애플리케이션의 middleware/ 에 저장됩니다(달리 설정하지 않는 한). 매개변수 middleware : 두 개의 Vue Router의 경로 위치 객체를 매개변수로 사용하는 함수: 첫 번째 경로는 다음 경로 to이고, 현재 경로는 from. type : RouteMiddleware Vue Router 문서에서 RouteLocationNormalized의 사용 가능한 속성에 대해 알 수 있다. 사용 예 오류 페이지 표시 경로 미들웨어를 사용하여 오류를 발생시키고 유용한 오류 메시지를 표시할 수 있다. // middleware/error.ts export default define..

defineNuxtComponent()는 옵션 API를 사용하여 유형이 안전한 구성 요소를 정의하기 위한 헬퍼 함수이다. defineNuxtComponent()은 defineComponent() 과 유사하며, 옵션 API를 사용한 유형이 안전한 Vue 컴포넌트를 정의하기 위한 헬퍼 함수이다. defineNuxtComponent() 래퍼 함수는 asyncData 및 head 컴포넌트 옵션에 대한 지원도 추가한다. head() 앱에서 setup() 을 사용하지 않기로 선택한 경우 컴포넌트 정의 내에서 head() 메소드를 사용할 수 있다.