页面逻辑

src/components/Tabs.vue

@@ -104,7 +104,7 @@ const ejectModalVisible = ref(false)
 
 const handleModalVisible = () => {
   ejectModalVisible.value = false
-  tabStore.updateActiveTab(1)
+  changeTab(1)
 }
 const changeTab = index => {
   tabStore.updateActiveTab(index)
@@ -112,6 +112,7 @@ const changeTab = index => {
     router.push('/')
   }
   if (index == 2) {
+    router.push('/test')
   }
   if (index == 3) {
     ejectModalVisible.value = true

src/pages/Test.vue

@@ -0,0 +1,49 @@
+<template>
+  <div class="test_container">
+    <div class="header_wrap"></div>
+    <div class="main_content"></div>
+    <Tabs />
+  </div>
+</template>
+
+<script setup>
+import Tabs from 'cpns/Tabs'
+import { onMounted } from 'vue'
+import { useTabStore } from '@/store'
+import { useRouter } from 'vue-router'
+
+const tabStore = useTabStore()
+const router = useRouter()
+
+onMounted(() => {
+  if (tabStore.activeTab == 1) {
+    router.push('/')
+  }
+})
+</script>
+
+<style lang="scss" scoped>
+.test_container {
+  width: 800px;
+  height: 1280px;
+  opacity: 1;
+  background: #fff;
+  overflow: hidden;
+  box-sizing: border-box;
+  padding: 30px 20px 20px 20px;
+  .header_wrap {
+    width: 760px;
+    height: 97px;
+    border-radius: 49px;
+    background: #f0f6fb;
+    margin-bottom: 20px;
+  }
+  .main_content {
+    width: 760px;
+    height: 1003px;
+    border-radius: 16px;
+    background: #f0f6fb;
+    margin-bottom: 20px;
+  }
+}
+</style>

src/router/index.js

@@ -1,6 +1,7 @@
 import { createRouter, createWebHashHistory } from 'vue-router'
 
 const Home = () => import('@/pages/Home')
+const Test = () => import('@/pages/Test')
 
 // 配置路由信息
 const routes = [
@@ -8,6 +9,10 @@ const routes = [
     path: '/',
     component: Home,
   },
+  {
+    path: '/test',
+    component: Test,
+  },
 ]
 
 const router = createRouter({