feat: route jump
This commit is contained in:
@@ -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
Reference in New Issue
Block a user