地址参数获取并跳转页面

src/App.vue

@@ -5,7 +5,6 @@
 </template>
 <script setup>
 import TopNav from 'cpns/TopNav'
-import QRCode from 'cpns/QRCode'
 import { toAnchor } from '@/common/utils'
 import { useSwiperStore } from '@/store'
 import { onMounted } from 'vue'

src/common/utils.js

@@ -181,126 +181,128 @@ export const totalPageAni = async (activeIndex, previousIndex) => {
 }
 
 export const addAnchor = activeIndex => {
+  const search = location.search
   if (activeIndex == 0) {
-    var url = location.pathname + '#home'
+    var url = search + '#home'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 1) {
-    var url = location.pathname + '#service'
+    var url = search + '#service'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 2) {
-    var url = location.pathname + '#cooperation'
+    var url = search + '#cooperation'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 3) {
-    var url = location.pathname + '#caselist'
+    var url = search + '#caselist'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 4) {
-    var url = location.pathname + '#casedetail'
+    var url = search + '#casedetail'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 5) {
-    var url = location.pathname + '#hardware'
+    var url = search + '#hardware'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 6) {
-    var url = location.pathname + '#harddetail'
+    var url = search + '#harddetail'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 7) {
-    var url = location.pathname + '#experience'
+    var url = search + '#experience'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 8) {
-    var url = location.pathname + '#hardwareshow'
+    var url = search + '#hardwareshow'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 9) {
-    var url = location.pathname + '#webofthing'
+    var url = search + '#webofthing'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 10) {
-    var url = location.pathname + '#control'
+    var url = search + '#control'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 11) {
-    var url = location.pathname + '#drive'
+    var url = search + '#drive'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 12) {
-    var url = location.pathname + '#readwidely'
+    var url = search + '#readwidely'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 13) {
-    var url = location.pathname + '#culture'
+    var url = search + '#culture'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 14) {
-    var url = location.pathname + '#recruit'
+    var url = search + '#recruit'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 15) {
-    var url = location.pathname + '#video'
+    var url = search + '#video'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
   if (activeIndex == 16) {
-    var url = location.pathname + '#contact'
+    var url = search + '#contact'
     history.pushState({ url: url, title: document.title }, document.title, url)
   }
 }
 
 export const toAnchor = url => {
-  if (url == '/#home') {
+  const search = location.search
+  if (url == search + '#home') {
     return 0
   }
-  if (url == '/#service') {
+  if (url == search + '#service') {
     return 1
   }
-  if (url == '/#cooperation') {
+  if (url == search + '#cooperation') {
     return 2
   }
-  if (url == '/#caselist') {
+  if (url == search + '#caselist') {
     return 3
   }
-  if (url == '/#casedetail') {
+  if (url == search + '#casedetail') {
     return 4
   }
-  if (url == '/#hardware') {
+  if (url == search + '#hardware') {
     return 5
   }
-  if (url == '/#harddetail') {
+  if (url == search + '#harddetail') {
     return 6
   }
-  if (url == '/#experience') {
+  if (url == search + '#experience') {
     return 7
   }
-  if (url == '/#hardwareshow') {
+  if (url == search + '#hardwareshow') {
     return 8
   }
-  if (url == '/#webofthing') {
+  if (url == search + '#webofthing') {
     return 9
   }
-  if (url == '/#control') {
+  if (url == search + '#control') {
     return 10
   }
-  if (url == '/#drive') {
+  if (url == search + '#drive') {
     return 11
   }
-  if (url == '/#readwidely') {
+  if (url == search + '#readwidely') {
     return 12
   }
-  if (url == '/#culture') {
+  if (url == search + '#culture') {
     return 13
   }
-  if (url == '/#recruit') {
+  if (url == search + '#recruit') {
     return 14
   }
-  if (url == '/#video') {
+  if (url == search + '#video') {
     return 15
   }
-  if (url == '/#contact') {
+  if (url == search + '#contact') {
     return 16
   }
 }

src/router/index.js

@@ -7,31 +7,6 @@ const routes = [
     name: 'index',
     component: () => import('@/views/Index'),
   },
-  // {
-  //   path: '/case',
-  //   name: 'case',
-  //   component: () => import('@/views/Case'),
-  // },
-  // {
-  //   path: '/soft-hardware',
-  //   name: 'softHardware',
-  //   component: () => import('@/views/SoftHardware'),
-  // },
-  // {
-  //   path: '/culture',
-  //   name: 'culture',
-  //   component: () => import('@/views/Culture'),
-  // },
-  // {
-  //   path: '/about',
-  //   name: 'about',
-  //   component: () => import('@/views/About'),
-  // },
-  // {
-  //   path: '/contact',
-  //   name: 'contact',
-  //   component: () => import('@/views/Contact'),
-  // },
 ]
 
 const router = createRouter({

src/views/Index/components/HeaderSwiper/index.vue

@@ -86,9 +86,7 @@ export default {
       const { activeIndex, previousIndex } = swiper
       // totalTitleAni(activeIndex, previousIndex)
       swiperStore.updateHeaderIndex(activeIndex)
-      console.log(activeIndex)
       if (activeIndex == 4) {
-        console.log(swiper.pagination.bullets)
         if (swiper.pagination.bullets.length > 0) {
           swiper.pagination.bullets[3].classList.add('active-class-2')
         }

src/views/Index/index.vue

@@ -131,6 +131,15 @@ export default {
       swiperStore.initSwiper(swiper)
       totalPageAni(activeIndex, previousIndex)
       addAnchor(activeIndex)
+      const search = location.search
+      // search优先级高 首先判断search 而后判断#
+      const params = new URLSearchParams(search)
+      const p = params.get('p')
+      if (p) {
+        if (p == 'contact') {
+          swiper.slideTo(16, 0, false)
+        }
+      }
     }
     const virtualOption = {
       enabled: true,