addRouter() 添加路由
使用場景
列如：菜單權限的分配（管理員與用戶不一致）

1. 根據后臺返回 參數 定義isAdmin
2. 根據isAdmin 分配

let isAdmin = true
// 添加路由 可以傳參 一級路由名稱 來添加二級路由
if (isAdmin) {router.addRoute({path: '/admin',component: () => import('../views/admin.vue')})router.addRoute('home', {path: 'vip',component: () => import('../views/vip.vue')})
}
//獲取所有路由
console.log(router.getRoutes());

路由導航守衛
beforeEach 回調函數，在頁面跳轉時觸發，接受參數，to，from to 當前路由，from 要跳轉的路由
使用場景：判斷是否登錄（一般根據token 判斷），
1.已登錄，跳轉訂單頁面，
2.沒登錄，跳轉登錄頁面

const token = localStorage.getItem('token')
router.beforeEach((to, from) => {console.log(to, from);if (!token && to.path == '/order') {return '/login'}
})

在登錄頁面時判斷是否登錄成功來執行是否跳轉

    <button @click="getLogin">登錄</button><button @click="setupLogin">退出登錄</button>
<script setup>import { useRouter } from "vue-router";const router = useRouter();function getLogin() {localStorage.setItem("token", "言念");router.push("/order");}function setupLogin() {localStorage.removeItem("token");router.push("/login");
}
</script>