image/tdesign-vue-next-starter
1
0
Fork 1
mirror of https://github.com/Tencent/tdesign-vue-next-starter.git synced 2024-11-10 07:28:24 +08:00
Code Issues Packages Projects Releases Wiki Activity

improve menuitem route by vue3.4'defineModel

Browse Source
This commit is contained in:
w 2024-03-31 00:09:49 +08:00
parent 13505fdedc
commit 440dbf8aac
2 changed files with 9 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
src/layouts/components/MenuContent.vue
View File

@ -8,7 +8,7 @@
</template> </template>
{{ renderMenuTitle(item.title) }} {{ renderMenuTitle(item.title) }}
</t-menu-item> </t-menu-item>
<t-menu-item v-else :name="item.path" :value="getPath(item)" :to="item.path"> <t-menu-item v-else :name="item.path" :value="getPath(item)" :to="item.path" @click="doMenuItemClick(item)">
<template #icon> <template #icon>
<component :is="menuIcon(item)" class="t-icon"></component> <component :is="menuIcon(item)" class="t-icon"></component>
</template> </template>
@ -41,7 +41,8 @@ const props = defineProps({
}, },
}); });
const active = computed(() => getActive()); const active = defineModel<string>({ default: '' });
//const active = computed(() => getActive());
const { locale } = useLocale(); const { locale } = useLocale();
const list = computed(() => { const list = computed(() => {
@ -106,6 +107,11 @@ const getPath = (item: ListItemType) => {
return item.meta?.single ? item.redirect : item.path; return item.meta?.single ? item.redirect : item.path;
}; };
const doMenuItemClick = (item: ListItemType) => {
//window.open(url);
active.value= item.path;
};
const openHref = (url: string) => { const openHref = (url: string) => {
window.open(url); window.open(url);
}; };

2
src/layouts/components/SideNav.vue
View File

@ -6,7 +6,7 @@
<component :is="getLogo()" :class="logoCls" /> <component :is="getLogo()" :class="logoCls" />
</span> </span>
</template> </template>
<menu-content :nav-data="menu" /> <menu-content :nav-data="menu" v-model:active="active"/>
<template #operations> <template #operations>
<span :class="versionCls"> {{ !collapsed ? 'TDesign Starter' : '' }} {{ pgk.version }} </span> <span :class="versionCls"> {{ !collapsed ? 'TDesign Starter' : '' }} {{ pgk.version }} </span>
</template> </template>