路由出口
<NuxtPage /> 是頁面出口,相當(dāng)于Vue中的 <router-view />,默認(rèn)指向 /pages/index.vue 頁面;例如:
<template>
<div>
<NuxtPage />
</div>
</template>
注:Nuxt3中組件只能有一個根元素;
路由跳轉(zhuǎn)
用于跳轉(zhuǎn)到指定頁面,如下:
<NuxtLink to="/detail">點擊我跳轉(zhuǎn)到/detail頁面</NuxtLink>
image
路由傳參
可以在目錄或頁面名稱中添加中括號參數(shù),系統(tǒng)會自動匹配識別路由中的參數(shù);如下:
訪問路由: /user-admin/100
路由參數(shù)的配置和獲?。?/p>
image
嵌套路由
目錄和文件同名,就形成了路由嵌套;如下圖:
image
訪問:/parent/,會加載名稱為 index.vue 的子頁面,因為 index 是默頁面;
訪問:/parent/child,會加載名稱為 child.vue 的子頁面;