install

npm install vue-router@4

setting

• 在src目录下建立文件夹router。

• 在router文件夹下建立文件index.js。代码如下：

  import {createRouter, createWebHistory} from "vue-router";
  
  const routes = [
    <!-- {
      path: '/', // 路径
      name: 'Dashboard', // 名称，英文
      componet: Deashboard // 组件
    } -->
  ];
  
  const router = createRouter({
    history: createWebHistory(),
    routes
  })
  
  export default router;
  

• 在项目的main.js中添加相关store代码：

  import { createApp } from 'vue'
  import store from './store'
  import router from './router'
  import App from './App.vue'
  
  creatApp(App)
    .use(store)
    .use(router)
    .mount('#app')
  

嵌套路由

守卫

登录验证

参考 33分钟内容 (opens new window)
参考 60分钟内容 (opens new window)