<二> 初识 vue-router 命名视图

router 对命名视图粗浅了解

做项目时将功能进行划分 ： 登录模块 和 主界面 或者 其他模块

当前用路由进行划分

主页路由

const main = [    {        path: '/',        components: {            default:import('@/views/main/main.vue')        }    }]

登录页路由

const login = [ { path: '/login', components: { default: import('@/views/login/index.vue') } }]

createRouter 路由

import { createRouter, createWebHistory } from 'vue-router'

const router = createRouter({    history: createWebHistory(),    routes: main.concat(login)})export default router

APP.vue  添加

 <router-view></router-view>

通过手动修改路由 就能实现  同一 router-vuew  加载不同视图模块

http://localhost:8080/ 加载 主页面

http://localhost:8080/login 加载登录页

后期可以动态的实现登录进入主界面

有不对之处请留言， 虚心接受