vue-student-management/src/router/index.js

import { createRouter, createWebHistory } from 'vue-router';
import Main from '@/views/Main.vue';
import ClassManagement from '@/views/class/ClassGrade.vue';
import StudentManagement from '@/views/student/StudentManagement.vue';

const routes = [
  {
    path: '/',
    component: Main,
    children: [
      // 班级管理路由
      {
        path: 'class/grade1',
        name: 'ClassGrade1',
        component: ClassManagement,
        meta: { title: '一年级班级', grade: 1 }
      },
      {
        path: 'class/grade2',
        name: 'ClassGrade2',
        component: ClassManagement,
        meta: { title: '二年级班级', grade: 2 }
      },
      {
        path: 'class/grade3',
        name: 'ClassGrade3',
        component: ClassManagement,
        meta: { title: '三年级班级', grade: 3 }
      },

      // 学生管理路由
      {
        path: 'student/grade1',
        name: 'StudentGrade1',
        component: StudentManagement,
        meta: { title: '一年级学生', grade: 1 }
      },
      {
        path: 'student/grade2',
        name: 'StudentGrade2',
        component: StudentManagement,
        meta: { title: '二年级学生', grade: 2 }
      },
      {
        path: 'student/grade3',
        name: 'StudentGrade3',
        component: StudentManagement,
        meta: { title: '三年级学生', grade: 3 }
      }
    ]
  },
  {
    path: '/',
    redirect: '/class/grade1'
  }
];

const router = createRouter({
  history: createWebHistory(),
  routes
});

export default router;