27 lines
828 B
Vue
27 lines
828 B
Vue
|
<template>
|
||
|
|
<template v-for="item in props.routeTree" :key="item.name">
|
||
|
|
<a-sub-menu v-if="item.children && item.children.length > 0" :key="item.name">
|
||
|
|
<template #icon><SvgIcon :name="item.meta.icon" :size="25" /></template>
|
||
|
|
<template #title>{{ item.meta.title }}</template>
|
||
|
|
<MenuItem :route-tree="item.children" />
|
||
|
|
</a-sub-menu>
|
||
|
|
<a-menu-item v-else :key="item.name">
|
||
|
|
<template #icon><SvgIcon :name="item.meta.icon" :size="25" /></template>
|
||
|
|
<div>{{ item.meta.title }}</div>
|
||
|
|
</a-menu-item>
|
||
|
|
</template>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup lang="ts">
|
||
|
|
defineOptions({ name: "MenuItem" });
|
||
|
|
// 通过defineProps接收父组件的值
|
||
|
|
const props = defineProps({
|
||
|
|
routeTree: {
|
||
|
|
type: Array,
|
||
|
|
default: () => []
|
||
|
|
}
|
||
|
|
});
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss" scoped></style>
|