进一步封装route

src/layout/index.vue

@@ -39,7 +39,7 @@ const handleChange = (value) => {
       <router-view v-else></router-view>
       <RequestLoading></RequestLoading>
     </div>
-    <div class="layout-footer">
+    <div class="layout-footer" v-if="$route.meta.showTabBar">
       <TabBar :data="tabBar" @chang="handleChange"></TabBar>
     </div>
   </div>

src/router/index.ts

@@ -6,14 +6,23 @@ const viewRouterModules = import.meta.glob('../views/**/*.vue')
 
 // 子路由
 const childRoutes = Object.keys(viewRouterModules).map((path)=>{	
-	const childName = path.match(/\.\.\/views\/(.*)\.vue$/)[1].split('/')[1];
+	let urlPath = path.match(/\.\.\/views\/(.*)\.vue$/)[1];
+	let keepAlive = false
+	let showTabBar = true
+	// 是否需要显示底部tabBar
+	if(['goods/detail'].includes(urlPath)) showTabBar = false
+	// 是否需要传递params
+	// todo
 	return {
-		path: `/${childName.toLowerCase()}`,
-		name: childName,
-		component: viewRouterModules[path]
-	} 
+		path: urlPath.toLowerCase(),
+		name: urlPath.replaceAll('/',''),
+		component: viewRouterModules[path],
+		meta: {
+			keepAlive,
+			showTabBar
+		}
+	}
 })
-console.log(viewRouterModules)
 // 根路由
 const rootRoutes = Object.keys(mainRouterModules).map((path) => {
     const name = path.match(/\.\.\/layout\/(.*)\.vue$/)[1].toLowerCase();
@@ -22,7 +31,7 @@ const rootRoutes = Object.keys(mainRouterModules).map((path) => {
 		return {
 			path: '/',
 			name,
-			redirect: '/home',
+			redirect: '/home/home',
 			component: mainRouterModules[path],
 			children: childRoutes
 		};

src/views/goods/Detail.vue

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+	
+</script>
+
+<template>
+	<div class="goods">
+		<CustomHeader title="商品详情" />
+		商品详情
+	</div>
+</template>
+
+
+
+<style lang="scss" scoped>
+
+</style>

src/views/goods/List.vue

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+	
+</script>
+
+<template>
+	<div class="goods">
+		<CustomHeader title="商品列表" />
+		商品列表
+	</div>
+</template>
+
+
+
+<style lang="scss" scoped>
+
+</style>

src/views/login/Login.vue

@@ -0,0 +1,16 @@
+<script setup lang="ts">
+	
+</script>
+
+<template>
+	<div class="login">
+		<CustomHeader title="登录" />
+		登录页面
+	</div>
+</template>
+
+
+
+<style lang="scss" scoped>
+
+</style>