32 lines
995 B
Vue
32 lines
995 B
Vue
|
<template>
|
||
|
|
<div> <!-- Add a single root element, like <div> -->
|
||
|
|
<template v-if="item.meta && !item.meta.hidden">
|
||
|
|
<el-sub-menu :index="item.path" :key="item.index" v-if="item?.children?.length > 0">
|
||
|
|
<template slot="title">{{ item.meta.title }}</template>
|
||
|
|
<menuItem v-for="child in item.children" :item="child" :key="child.index" />
|
||
|
|
</el-sub-menu>
|
||
|
|
<el-menu-item v-else :index="item.path" @click="toggleMenu">{{ item.meta.title }}</el-menu-item>
|
||
|
|
</template>
|
||
|
|
</div> <!-- Closing the root element -->
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script setup name="menuItem">
|
||
|
|
import { getCurrentInstance } from 'vue';
|
||
|
|
const props = defineProps({
|
||
|
|
item: {
|
||
|
|
type: Object,
|
||
|
|
default: () => { },
|
||
|
|
},
|
||
|
|
})
|
||
|
|
// 获取全局属性
|
||
|
|
const { proxy } = getCurrentInstance();
|
||
|
|
const showMenu = proxy.$showMenu;
|
||
|
|
|
||
|
|
const toggleMenu = () => {
|
||
|
|
showMenu.value = !showMenu.value;
|
||
|
|
console.log(showMenu.value);
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
<style lang='scss' scoped>
|
||
|
|
</style>
|