修正tab路由参数为query,解决原先采用params路由参数时导致主菜单选中状态不同步的问题

This commit is contained in:
Allen
2024-05-31 11:18:44 +08:00
parent 3ffe354770
commit 3321427eb4
7 changed files with 48 additions and 24 deletions

View File

@@ -9,6 +9,7 @@ import noImage from '@images/logos/plugin.png'
import { useDisplay } from 'vuetify'
import { isNullOrEmptyObject } from '@/@core/utils'
import { useDefer } from '@/@core/utils/dom'
import router from '@/router'
const route = useRoute()
@@ -19,7 +20,7 @@ const display = useDisplay()
let deferApp = (_: number) => true
// 当前标签
const activeTab = ref(route.params.tab)
const activeTab = ref(route.query.tab)
// 标签页
const tabs = [
@@ -320,6 +321,11 @@ function handleRepoUrl(url: string | undefined) {
return url.replace('https://github.com/', '').replace('https://raw.githubusercontent.com/', '')
}
// 跳转tab
function jumpTab(tab: string) {
router.push("/plugins?tab=" + tab)
}
// 加载时获取数据
onBeforeMount(async () => {
await refreshData()
@@ -330,7 +336,7 @@ onBeforeMount(async () => {
<template>
<div>
<VTabs v-model="activeTab">
<VTab v-for="item in tabs" :value="item.tab" :to="'/plugins/' + item.tab">
<VTab v-for="item in tabs" :value="item.tab" @click="jumpTab(item.tab)">
<span class="mx-5">{{ item.title }}</span>
</VTab>
</VTabs>