Vue实现顶部栏和侧边栏不变


要使用Vue实现顶部栏和侧边栏不变,首先Main.vue代码如下:

<template>
  <NavBar />
  <router-view>router-view>
  <SideBar />
template>

NavBar和SideBar是顶部栏和侧边栏的组件。

然后在router/index.js中配置嵌套路由:

{
  path: "/main",
  component: () => import("../components/Main.vue"),
  redirect: "/editionLog",
  children: [
    {
      path: "/quizManage",
      component: () => import("../views/QuizManage/QuizManage.vue"),
    },
    {
      path: "/editionLog",
      component: () => import("../views/EditionLog/EditionLog.vue"),
    },
  ]
}

即可。

vue