mt-yd-ui/src/views/main-sidebar.vue

<template>
	<aside :class="['aui-sidebar', `aui-sidebar--${$store.state.sidebarLayoutSkin}`]">
		<div class="aui-sidebar__inner">
			<el-menu
				:default-active="$store.state.sidebarMenuActiveName"
				:collapse="$store.state.sidebarFold"
				:unique-opened="true"
				:collapseTransition="false"
				class="aui-sidebar__menu"
			>
				<sub-menu v-for="menu in unhiddenMenuList" :key="menu.id" :menu="menu" />
			</el-menu>
		</div>
	</aside>
</template>

<script>
import SubMenu from './main-sidebar-sub-menu'
export default {
	data() {
		return {
			unhiddenMenuList: []
		}
	},
	components: {
		SubMenu
	},
	mounted() {
		// this.$store.state.sidebarMenuList = window.SITE_CONFIG['menuList']
		this.$nextTick(() => {
			this.unhiddenMenuList = this.getUnhiddenRoutesListFrom(window.SITE_CONFIG['menuList'])
			/** 本地保存一份，store保存一份，感觉 store 都不需要保存... */
			this.$store.state.sidebarMenuList = this.unhiddenMenuList
		})
	},
	methods: {
		getUnhiddenRoutesListFrom(fullList) {
			const list = []
			if (fullList.length) {
				fullList.forEach(menu => {
					if (menu.sort !== 99) {
						/** 前后端约定，路由排序值为 99 时不在前端的侧边栏展示该路由 */
						const newRouteItem = JSON.parse(JSON.stringify(menu))
						if (menu.children) {
							newRouteItem.children = this.getUnhiddenRoutesListFrom(menu.children)
						}
						list.push(newRouteItem)
					} else {
						console.log(menu.name, '是应该被隐藏的路由')
					}
				})
			}
			return list
		}
	}
}
</script>