在index.html文件中修改title为校园点餐系统

在路由router.index.ts中配置自动跳转到首页通过redirect: '/dashboard'实现首页自动跳转在views文件夹中创建首页文件夹dashboard以及Index.vue 修改菜单layout.Menu.vue,增加首页选项
3 months ago · c35f0cfdb4
parent 6b88c8cf43
commit c35f0cfdb4
4 changed files with 33 additions and 3 deletions
--- a/order-system/index.html
+++ b/order-system/index.html
@ -4,7 +4,8 @@
    <meta charset="UTF-8" />
    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Vite + Vue + TS</title>
+    <!-- 修改主页标题 -->
+    <title>校园点餐系统</title>
  </head>
  <body>
    <div id="app"></div>
--- a/order-system/src/layout/Menu.vue
+++ b/order-system/src/layout/Menu.vue
@ -39,6 +39,12 @@
      <template #title>Navigator Three</template>
    </el-menu-item> -->

+
+    <!-- 新增首页菜单栏选项 -->
+    <el-menu-item index="/dashboard">
+      <el-icon><Menu /></el-icon>
+      <template #title>首页</template>
+    </el-menu-item>
    <!-- 添加菜单栏选项 -->
    <el-menu-item index="/user">
      <el-icon><Menu /></el-icon>
--- a/order-system/src/router/index.ts
+++ b/order-system/src/router/index.ts
@ -10,12 +10,22 @@ import Layout from '@/layout/Index.vue'

 const routes: Array<RouteRecordRaw> = [
  {
-    path: '/home',
-    name: 'home', //name中home大小写错误，第32次提交之前为大写
+    // 通过redirect: '/dashboard'实现首页自动跳转
+    path: '/',
+    // name: 'home', //name中home大小写错误，第32次提交之前为大写
    component: Layout,

+    // 实现打开浏览器后自动跳转首页
+    redirect: '/dashboard',
+
    // 添加子页面路由
    children: [
+      // 添加首页面路由
+      {
+        path: '/dashboard',
+        name: 'dashboard',
+        component: () => import('@/views/dashboard/Index.vue')
+      },
      {
        path: '/banner',
        name: 'banner',
--- a/order-system/src/views/dashboard/Index.vue
+++ b/order-system/src/views/dashboard/Index.vue
@ -0,0 +1,13 @@
+<template>
+  <div>
+    首页面
+  </div>
+</template>
+
+<script setup lang="ts">
+
+</script>
+
+<style scoped>
+
+</style>