搞定图标

This commit is contained in:
2023-01-07 11:57:10 +08:00
parent 0b79a94bda
commit 82edc407db
6 changed files with 3477 additions and 13 deletions

View File

@@ -2,7 +2,7 @@
* @Author: Kane
* @Date: 2023-01-04 11:30:33
* @LastEditors: Kane
* @LastEditTime: 2023-01-06 19:24:41
* @LastEditTime: 2023-01-07 11:53:26
* @FilePath: \admin_system\src\layout\components\Aside.vue
* @Description:
*
@@ -16,16 +16,23 @@
<template v-if="hasOnlyChild(route.children)">
<!-- 当只有一个子路由时直接渲染子路由 -->
<el-menu-item :index="route.children[0].path">
<div>{{ route.children[0].meta && route.children[0].meta.title }}</div>
<component :is="route.children[0].meta.icon" class="icons">
</component>
<!-- <el-icon v-html="route.children[0].meta && route.children[0].meta.icon"></el-icon> -->
<template #title>{{ route.children[0].meta && route.children[0].meta.title }}</template>
</el-menu-item>
</template>
<template v-else>
<!-- 不是一个子路由时有可能没有子路由或者是多个子路由 -->
<el-sub-menu v-if="route.children && route.children.length" :index="route.path">
<template #title>{{ route.meta && route.meta.title }}</template>
<template #title>
<component :is="route.children[0].meta.icon" class="icons"></component>
<span>{{ route.meta && route.meta.title }}</span>
</template>
<template v-for="child in route.children" :key="child.path">
<el-menu-item v-if="!child.hidden" :index="child.path">
<div>{{ child.meta && child.meta.title }}</div>
<component :is="route.children[0].meta.icon" class="icons"></component>
<template #title>{{ child.meta && child.meta.title }}</template>
</el-menu-item>
</template>
</el-sub-menu>
@@ -33,7 +40,6 @@
</template>
</template>
</el-menu>
<a href="#/newsedit">测试</a>
</template>
<script>
@@ -99,6 +105,12 @@ export default {
/* background-color: #344a5f !important; */
}
.icons {
width: 1em;
height: 1em;
margin-right: 8px;
}
/* .el-menu-item {
padding: 5px;
border: 1px solid red;