主导航切换演示示例调整

Author: hooray

src/views/feature_example/menuswitch.vue

@@ -1,15 +1,19 @@
 <route lang="yaml">
 meta:
   enabled: false
-  </route>
+</route>
 
 <script setup lang="ts">
 const settingsStore = useSettingsStore()
 const menuStore = useMenuStore()
 
 const menu = useMenu()
 
-function switchTo() {
+function switchToPrev() {
+  menu.switchTo(menuStore.actived - 1 >= 0 ? menuStore.actived - 1 : menuStore.allMenus.length - 1)
+}
+
+function switchToNext() {
   menu.switchTo(menuStore.actived + 1 < menuStore.allMenus.length ? menuStore.actived + 1 : 0)
 }
 </script>
@@ -19,7 +23,10 @@ function switchTo() {
     <FaPageHeader title="主导航切换" description="可切换并激活指定的主导航" />
     <FaPageMain>
       <p>该特性只有在导航模式为 side 和 head 时生效。</p>
-      <ElButton :disabled="!['side', 'head'].includes(settingsStore.settings.menu.mode)" @click="switchTo">
+      <ElButton :disabled="!['side', 'head'].includes(settingsStore.settings.menu.mode)" @click="switchToPrev">
+        切换上一个
+      </ElButton>
+      <ElButton :disabled="!['side', 'head'].includes(settingsStore.settings.menu.mode)" @click="switchToNext">
         切换下一个
       </ElButton>
     </FaPageMain>