MyAside.vue

<template>
	<el-menu :default-openeds="['1', '2', '3']" default-active="$route.path" class="layout-aside-container" background-color="#fff" text-color="#000" active-text-color="#42b983">
		<el-submenu index="1">
			<template slot="title">
				<i class="el-icon-thumb"></i>
				CSDN管理
			</template>
			<el-menu-item-group>
				<template slot="title">常用功能</template>
				<router-link :to="{ path: '/home/tripletDayInfo' }">
					<el-menu-item index="/home/tripletDayInfo">阈值管理</el-menu-item>
				</router-link>
				<router-link :to="{ path: '/home/accountManagement' }">
					<el-menu-item index="/home/accountManagement">余额管理</el-menu-item>
				</router-link>
			</el-menu-item-group>
			<el-menu-item-group>
				<template slot="title">用户相关</template>
				<router-link :to="{ path: '/home/csdnUser' }">
					<el-menu-item index="/home/csdnUser">用户管理</el-menu-item>
				</router-link>
				<router-link :to="{ path: '/home/fansInfo' }">
					<el-menu-item index="/home/fansInfo">粉丝管理</el-menu-item>
				</router-link>
			</el-menu-item-group>
			<el-menu-item-group>
				<template slot="title">三连相关</template>
				<router-link :to="{ path: '/home/articleInfo' }">
					<el-menu-item index="/home/articleInfo">文章管理</el-menu-item>
				</router-link>
				<router-link :to="{ path: '/home/message' }">
					<el-menu-item index="/home/message">私信管理</el-menu-item>
				</router-link>
			</el-menu-item-group>
		</el-submenu>
		<el-submenu index="2">
			<template slot="title">
				<i class="el-icon-question"></i>
				面试题
			</template>
			<el-menu-item-group>
				<router-link :to="{ path: '/home/interview' }">
					<el-menu-item index="/home/interview">面试题管理</el-menu-item>
				</router-link>
				<router-link :to="{ path: '/home/algorithmic' }">
					<el-menu-item index="/home/algorithmic">算法题管理</el-menu-item>
				</router-link>
			</el-menu-item-group>
		</el-submenu>
		<el-submenu index="3">
			<template slot="title">
				<i class="el-icon-document"></i>
				文档管理
			</template>
			<el-menu-item-group>
				<router-link :to="{ path: '/home/aphorismPoetry' }">
					<el-menu-item index="/home/aphorismPoetry">诗词管理</el-menu-item>
				</router-link>
				<router-link :to="{ path: '/home/chat' }">
					<el-menu-item index="/home/chat">CHAT管理</el-menu-item>
				</router-link>
				<router-link :to="{ path: '/home/pic' }">
					<el-menu-item index="/home/pic">图片管理</el-menu-item>
				</router-link>
			</el-menu-item-group>
		</el-submenu>
		<!-- The rest of your code for other menu items and submenus -->
	</el-menu>
</template>
<script>
export default { name: 'MyAside' }
</script>

<style lang="less" scoped>
.layout-aside-container {
	width: 200px;
	height: 100%;
	border-right: 1px solid #eaeaea;
}

.left-aside-item {
	font-size: 20px;
}
</style>