feat: route jump

This commit is contained in:
Rogee
2025-05-15 10:03:59 +08:00
parent 378d3724b3
commit 3a23d4b4b3
2 changed files with 6 additions and 10 deletions

View File

@@ -14,7 +14,7 @@ const tabs = [
const switchTab = (index, route) => { const switchTab = (index, route) => {
activeTab.value = index activeTab.value = index
router.push(route) router.replace(route)
} }
</script> </script>
@@ -30,17 +30,13 @@ const switchTab = (index, route) => {
<nav class="flex-none bg-white border-t border-gray-200 shadow-[0_-1px_3px_rgba(0,0,0,0.05)]"> <nav class="flex-none bg-white border-t border-gray-200 shadow-[0_-1px_3px_rgba(0,0,0,0.05)]">
<div class="flex justify-around items-center h-14 max-w-[480px] mx-auto px-2"> <div class="flex justify-around items-center h-14 max-w-[480px] mx-auto px-2">
<div v-for="(tab, index) in tabs" <div v-for="(tab, index) in tabs" :key="index"
:key="index" class="flex flex-col items-center justify-center w-full h-full py-1 select-none" :class="[
class="flex flex-col items-center justify-center w-full h-full py-1 select-none"
:class="[
activeTab === index activeTab === index
? 'text-primary-600' ? 'text-primary-600'
: 'text-gray-500 hover:text-primary-500 active:text-primary-700' : 'text-gray-500 hover:text-primary-500 active:text-primary-700'
]" ]" @click="switchTab(index, tab.route)">
@click="switchTab(index, tab.route)"> <component :is="tab.icon" class="w-6 h-6 transition-colors duration-200" />
<component :is="tab.icon"
class="w-6 h-6 transition-colors duration-200" />
<span class="mt-1 text-xs font-medium">{{ tab.label }}</span> <span class="mt-1 text-xs font-medium">{{ tab.label }}</span>
</div> </div>
</div> </div>

File diff suppressed because one or more lines are too long