Vue Router 実装ガイド - 基本設定から応用テクニック
ステップ1: ルーターのインストール
npm install vue-router --save
ルーティング設定の基本構文
router/index.js での設定
import Vue from "vue";
import Router from "vue-router";
import HelloWorld from "@/components/HelloWorld";
Vue.use(Router);
export default new Router({
routes: [
{
path: "/sample",
component: SampleComponent,
...
7月15日 00:54 投稿
Vue Routerの高度なナビゲーション制御と動的ルーティング
ナビゲーションガードの実装
グローバルガード
const router = createRouter({
history: createWebHistory(),
routes: [
{ path: '/', name: 'top', component: TopView },
{ path: '/profile', name: 'profile', component: ProfileView }
]
})
// グローバル前置ガード
router.beforeEach((destination, origin) => {
if (destination.name === 'profil ...
6月18日 22:16 投稿