使用el-menu做侧边栏导航遇到需要点击两次菜单才展开

在根据路由遍历生成侧边导航栏时,遇到一个问题,就是当我点击选中某个垂直菜单时,只有点击第二次它才会展开,第一次在选中垂直菜单之后垂直菜单它就收缩起来了,如下图:
在这里插入图片描述
如上图,在我第一次点击选中“告警管理”这个菜单的时候,外联监测它会立马收缩起来,当我第二次点击时就不会收缩,而是展开状态,这是因为我的el-menu里default-active和el-submenu的index及el-menu-item的index属性不一致导致的,default-openeds和default-active尽量不要同时存在,删掉default-openeds即可,路由里name都一定要写上,不然会在控制台报警告,如下截图:
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

由于我们这个侧边菜单栏是拿到该角色所拥有的菜单数组集合,那这里面可能有一些公共的路由,比如404,登录login等这些路由(特点是hidden为true,即默认隐藏的路由),所以我们需要在sideMenus.vue里接收到menuList之后进行递归处理掉hidden为true那些路由。下面附上asileLeft.vue、sideMenus.vue、和路由配置index.js的全部代码:

// asileLeft.vue<template><div class="asileLeft"><el-aside class="slider_container"><!--      :default-active="$route.path"             --><el-menumode="vertical"unique-openedbackground-color="#fff"text-color="#fff"active-text-color="#409EFF":collapse-transition="false":collapse="collapse":default-active="$route.name"ref="elMenuRef"class="el-menu"><!-- 菜单组件 --><side-Meuns :menuList="menuList" :collapse="collapse"></side-Meuns></el-menu></el-aside></div>
</template><script>
import sideMeuns from "./sideMeuns";
export default {name: "asileLeft",props: {menuList: {type: Array,},collapse: {type: Boolean,},},computed: {activeMenu() {const route = this.$route;const { meta, path } = route;// console.log("监听菜单切换2", meta, route);// if set path, the sidebar will highlight the path you setif (meta.activeMenu) {return meta.activeMenu;}return path;},},data() {return {};},components: { sideMeuns },methods: {},
};
</script><style lang="scss" scoped>
.asileLeft {background-color: #d3dce6;color: #333;text-align: left;width: 230px !important;
}::v-deep .el-submenu .el-menu-item {box-shadow: none !important;
}
</style>
// sideMenus.vue<template><div class=""><!-- 遍历路由表,生成左侧菜单 --><divv-for="(item, memuIndex) in meuns":key="item.path + memuIndex + suijiNum()"><!--  :index="item.menuIdEx"--><el-submenuv-if="item.children && item.children.length":index="item.name":key="item.path + memuIndex + suijiNum()"><template slot="title"><item:icon="item.meta && item.meta.icon":title="item.meta && item.meta.title"/></template><!-- 二级菜单 --><divv-for="(myItem, myIndex) in item.children":key="myItem.path + myIndex + suijiNum()"><!-- :index="myItem.menuIdEx" --><el-submenuv-if="myItem.children && myItem.children.length":index="myItem.name":key="myItem.path + myIndex + suijiNum()"><template slot="title"><item:icon="myItem.meta && myItem.meta.icon":title="myItem.meta && myItem.meta.title"/></template><!-- 三级菜单   :index="myItem2.menuIdEx"--><el-menu-itemv-for="(myItem2, index2) in myItem.children":index="myItem2.name":key="myItem2.path + index2 + suijiNum()":class="currentRouteName == myItem2.name ? 'select' : ''"@click.native="setPath(myItem2, myItem2.path, $event, '3', index2)"style="position: relative"><item:icon="myItem2.meta && myItem2.meta.icon":title="myItem2.meta && myItem2.meta.title"/><spanv-if="currentRouteName == myItem2.name"style="position: absolute; top: 0px; right: 0.65rem"><img src="@/assets/toRight.png" alt="" /></span></el-menu-item></el-submenu><!--  :index="myItem.menuIdEx"--><el-menu-itemv-else:index="myItem.name":key="myIndex + suijiNum()":class="currentRouteName == myItem.name ? 'select' : ''"@click.native="setPath(myItem, myItem.path, $event, '2', myIndex)"style="position: relative"><item:icon="myItem.meta && myItem.meta.icon":title="myItem.meta && myItem.meta.title"/><spanv-if="currentRouteName == myItem.name"style="position: absolute; top: 0px; right: 0.65rem"><img src="@/assets/toRight.png" alt="" /></span></el-menu-item></div></el-submenu><!-- :index="item.menuIdEx" --><el-menu-item:class="currentRouteName == item.name ? 'select' : 'noSelect'"@click.native="setPath(item, item.path, $event, '1', memuIndex)"v-else:index="item.name":key="suijiNum()"class="firstMenu"style="position: relative":style="{ 'margin-left': collapse ? '-0.01rem' : '' }"><item:icon="item.meta && item.meta.icon":title="item.meta && item.meta.title"/><spanv-if="!collapse && currentRouteName == item.name"style="position: absolute; top: 0px; right: 0.65rem"><img src="@/assets/toRight.png" alt="" /></span></el-menu-item></div></div>
</template>
<script>
import Item from "./Item";
import AppLink from "./Link";
export default {title: "sideMeuns",components: { Item, AppLink },props: {menuList: {type: Array,default: () => [],},collapse: {type: Boolean,default: false,},},data() {return {meuns: "",selectPath: "",currentRouteName: "",};},watch: {menuList: {handler(newVal, oldVal) {// console.log("接收", newVal);let arr = this.Waydigui(newVal);this.meuns = arr;this.$forceUpdate();},immediate: true,},$route: {handler(newVal, oldVal) {// console.log("路由", newVal, oldVal);this.currentRouteName = newVal.name;},immediate: true,},},methods: {Waydigui(allArr) {//递归过滤掉所有hidden为true的项return allArr.filter((item) => {if (item.children) {item.children = this.Waydigui(item.children);}if (!item.hidden) {return true;}});},setPath(item, path, even, type, index) {//点击菜单// console.log("setPath", item, path, even, type, this.$route, index);if (type == 1) {//选中的是一级} else if (type == 2) {//选中的是二级} else if (type == 3) {//选中的是三级}this.selectPath = path;this.$router.push({path,});},//生成随机数suijiNum() {var timestamp = Date.parse(new Date());return Math.round(Math.random() * 100000000000000) + timestamp + "";},},
};
</script><style lang="scss" scoped>
::v-deep .el-menu {background: #ffffff !important;color: #838a9d !important;div {li {margin: 0 10px;&:hover {// max-width: 14.6rem !important;border-radius: 4px !important;}}}
}::v-deep .el-submenu {.el-submenu__title {position: relative;color: #838a9d !important;height: 2.5rem !important;line-height: 2.5rem !important;.el-submenu__icon-arrow {// border: 1px solid red;position: absolute;top: 50%;right: 3.2rem;}&:hover {// background-color: #00b259 !important;// color: #fff !important;border-radius: 4px !important;i {// color: #fff !important;}}}
}::v-deep .el-menu-item {background: #ffffff !important;color: #838a9d !important;border: none !important;padding-left: 2.5rem !important;box-shadow: none !important;margin: 0 10px;&:hover {// background-color: #00b259 !important;// color: #fff !important;// max-width: 14.6rem !important;border-radius: 4px;}
}::v-deep .firstMenu {padding-left: 0.68rem !important;.navSpan {margin-left: -0.23rem;}
}::v-deep .select {background: #00b259 !important;max-width: 14.6rem !important;border-radius: 4px;color: #fff !important;// margin-left: 10px;
}
::v-deep .noSelect {background: #fff !important;color: #838a9d !important;
}
</style>
// 路由配置index.jsimport Vue from 'vue'
import Router from 'vue-router'Vue.use(Router)/* Layout */
import Layout from '@/layout'
import LayoutNoLeftMenu from '@/layout/LayoutNoLeftMenu.vue'
import LayoutEx from '@/layoutEx'import Layout1 from '@/layout/components/layout1'/*** Note: sub-menu only appear when route children.length >= 1* Detail see: https://panjiachen.github.io/vue-element-admin-site/guide/essentials/router-and-nav.html** hidden: true                   if set true, item will not show in the sidebar(default is false)* alwaysShow: true               if set true, will always show the root menu*                                if not set alwaysShow, when item has more than one children route,*                                it will becomes nested mode, otherwise not show the root menu* redirect: noRedirect           if set noRedirect will no redirect in the breadcrumb* name:'router-name'             the name is used by <keep-alive> (must set!!!)* meta : {perms: ['admin','editor']    control the page perms (you can set multiple perms)title: 'title'               the name show in sidebar and breadcrumb (recommend set)icon: 'svg-name'             the icon show in the sidebarbreadcrumb: false            if set false, the item will hidden in breadcrumb(default is true)activeMenu: '/example/list'  if set path, the sidebar will highlight the path you set}*//*** constantRoutes* a base page that does not have permission requirements* all perms can be accessed*/// 所有情况都展示menuIdEx为0
//
export const constantRoutes = [{path: '/login',name: 'login',component: () => import('@/views/login/index'),hidden: true,menuIdEx: '0',},{path: '/register',name: 'register',component: () => import('@/views/register/index'),hidden: true,menuIdEx: '0',},{path: '/404',name: '404',component: () => import('@/views/404'),hidden: true,menuIdEx: '0',},
]/*** asyncRoutes* the routes that need to be dynamically loaded based on user perms*/
export const asyncRoutes = [//首页{path: '/',menuIdEx: '1',component: LayoutNoLeftMenu,redirect: '/homePage',// component: () => import('@/views/homePage/homePage.vue'),name: 'homePage',meta: {title: '首页',icon: '首页',perms: ['homePage'],menuName: '首页',keepAlive: false,breadcrumb: false,},children: [{menuIdEx: '1-1',path: '/homePage',name: 'homePage',component: () => import('@/views/homePage/homePage.vue'),meta: {title: '首页',icon: '首页',perms: ['homePage'],menuName: '首页',keepAlive: false,breadcrumb: true,},hidden: true,},],},// 外联监测-----------------------------------------------------------------//外联监测-告警管理{path: '/outDevice',menuIdEx: '2',component: Layout,redirect: '/warn-manage',name: 'warn-manage',meta: {title: '外联监测',icon: '外联监测',perms: ['externalMonitoring'],menuName: '外联监测',},children: [{menuIdEx: '2-1',path: '/warn-manage',name: 'warn-manage',component: () => import('@/views/outDevice/warn-manage.vue'),meta: {title: '告警管理',icon: '监测对象列表',perms: ['alarmManage'],menuName: '外联监测',},},//外联监测-告警日志{menuIdEx: '2 - 2',path: '/warn-log',name: 'warn-log',component: () => import('@/views/outDevice/warn-log.vue'),meta: {title: '告警日志',icon: '监测对象列表',perms: ['alarmLog'],menuName: '外联监测',},},//外联监测-策略设置{menuIdEx: '2 - 3',path: '/stragey-setting',name: 'stragey-setting',component: () => import('@/views/outDevice/stragey-setting.vue'),meta: {title: '策略设置',icon: '监测对象列表',perms: ['policySettings'],menuName: '外联监测',},},],},//监测对象管理--监测对象管理{path: '/assets',menuIdEx: '3',component: Layout,redirect: '/assetsList',name: 'assetsList',meta: {title: '监测对象管理',icon: '监测对象管理',perms: ['assets'],menuName: '监测对象管理',exname: '',},children: [{menuIdEx: '3 - 1',path: '/assetsList',name: 'assetsList',component: () => import('@/views/assets/assetsList.vue'),meta: {title: '监测对象列表',icon: '监测对象列表',perms: ['assetsList'],menuName: '监测对象管理',},},{menuIdEx: '3-1-1',path: '/assetAddEdit',name: 'assetAddEdit',component: () => import('@/views/assets/assetAddEdit.vue'),meta: {title: '监测对象管理',icon: '监测对象列表',perms: ['assetsList'],menuName: '监测对象管理',backBtn: true,},hidden: true,},// 除黄石外 其他地区没有这个页面// {//   menuIdEx: 1,//   path: '/ipManage',//   name: 'ipManage',//   component: () => import('@/views/assets/ipManage.vue'),//   meta: {//     title: '监测对象地址管理',//     icon: '监测对象列表',//     perms: ['ipManage'],//     menuName: '监测对象管理',//     backBtn: false,//   },//   hidden: window.g.ifHiddenAssetChangeAndWaitingFlag,// },// 复制的一份 这个页面有黄石没有的功能// {//   menuIdEx: 1,//   path: '/ipManage',//   name: 'ipManage',//   component: () => import('@/views/ipManage-copy/ipManage.vue'),//   meta: {//     title: '监测对象地址管理',//     icon: '监测对象列表',//     perms: ['ipManage'],//     menuName: '监测对象管理',//     backBtn: false,//   },// },// {//   menuIdEx: 1,//   path: '/changeList',//   name: 'changeList',//   component: () => import('@/views/assetPool/changeList.vue'),//   meta: {//     title: '监测对象变更列表',//     icon: '监测对象列表',//     perms: ['changeList'],//     menuName: '监测对象管理',//     backBtn: false,//   },//   hidden: window.g.ifHiddenAssetChangeAndWaitingFlag,// },// {//   menuIdEx: 1,//   path: '/waitingList',//   name: 'waitingList',//   component: () => import('@/views/assetPool/waitingList.vue'),//   meta: {//     title: '监测对象待处理列表',//     icon: '监测对象列表',//     perms: ['waitingList'],//     menuName: '监测对象管理',//     backBtn: false,//   },//   hidden: window.g.ifHiddenAssetChangeAndWaitingFlag,// },{menuIdEx: '3 - 2',path: '/assetPool',name: 'assetPool',component: () => import('@/views/assetPool/assetPool.vue'),meta: {title: '监测对象档案',icon: '监测对象列表',perms: ['assetPool'],menuName: '监测对象管理',},},{menuIdEx: '3 - 3',path: '/assetPoolDetail',name: 'assetPoolDetail',component: () => import('@/views/assetPool/assetPoolDetail.vue'),meta: {title: '监测对象档案详情',icon: '监测对象列表',perms: ['assetPoolDetail'],menuName: '监测对象管理',backBtn: true,},hidden: true,},{menuIdEx: '3 - 4',path: '/assetPoolAddEdit',name: 'assetPoolAddEdit',component: () => import('@/views/assetPool/assetPoolAddEdit.vue'),meta: {title: '监测对象档案管理',icon: '监测对象列表',perms: ['assetPoolAddEdit'],menuName: '监测对象管理',backBtn: true,},hidden: true,},// {//   menuIdEx: 1,//   path: '/failList',//   name: 'failList',//   component: () => import('@/views/assetPool/failList.vue'),//   meta: {//     title: '失败明细列表',//     icon: '监测对象列表',//     perms: ['failList'],//     menuName: '监测对象管理',//     backBtn: false,//   },// },{menuIdEx: '3 - 5',path: '/waitingDetail',name: 'waitingDetail',component: () => import('@/views/assetPool/waitingDetail.vue'),meta: {title: '待处理监测对象详情',icon: '监测对象列表',perms: ['waitingDetail'],menuName: '监测对象管理',backBtn: true,},hidden: true,},// {//   menuIdEx: 1,//   path: '/reportSetting',//   name: 'reportSetting',//   component: () => import('@/views/assetPool/reportSetting.vue'),//   meta: {//     title: '上报接口配置',//     icon: '监测对象列表',//     perms: ['reportSetting'],//     menuName: '监测对象管理',//     backBtn: false,//   },// },// {//   menuIdEx: '3 - 6',//   path: '/ipCascade',//   name: 'ipCascade',//   component: () => import('@/views/assets/ipCascade.vue'),//   meta: {//     title: '级联IP管理',//     icon: '监测对象列表',//     perms: ['ipCascade'],//     menuName: '监测对象管理',//   },// },{menuIdEx: '3 - 7',path: '/ip-cascade-edit',name: 'ip-cascade-edit',component: () => import('@/views/assets/ip-cascade-edit.vue'),meta: {title: '级联IP管理详情',icon: '监测对象列表',perms: ['ipCascade'],menuName: '监测对象管理',backBtn: true,},hidden: true,},//监测对象管理--审批列表{path: '/regUserList',menuIdEx: '3 - 8',name: 'regUserList',component: () => import('@/views/assets/regUserList.vue'),meta: {title: '审批列表',icon: '监测对象列表',perms: ['regUserList'],menuName: '监测对象管理',},},//监测对象管理--用户列表{path: '/userList',menuIdEx: '3 - 9',name: 'userList',component: () => import('@/views/assets/userList.vue'),meta: {title: '用户列表',icon: '监测对象列表',perms: ['userList'],menuName: '监测对象管理',},},{path: '/userListAdd',menuIdEx: '3 - 10',name: 'userListAdd',component: () => import('@/views/assets/userListAdd.vue'),meta: {title: '新增用户',icon: 'user',perms: ['userListAdd'],menuName: '监测对象管理',backBtn: true,},hidden: true,},//监测对象管理--组织架构{path: '/groupList',menuIdEx: '3 - 11',name: 'groupList',component: () => import('@/views/assets/groupList.vue'),meta: {title: '组织架构',icon: '监测对象列表',perms: ['groupList'],menuName: '监测对象管理',},},//监测对象管理-{path: '/userDetail',menuIdEx: '3 - 12',name: 'userDetail',component: () => import('@/views/assets/userDetail.vue'),meta: {title: '用户详情',icon: 'user',perms: ['userDetail'],menuName: '监测对象管理',backBtn: true,},hidden: true,},{path: '/assetsDetail',menuIdEx: '3 - 13',name: 'assetsDetail',component: () => import('@/views/assets/assetsDetail.vue'),meta: {title: '监测对象详情',icon: 'user',perms: ['assetsList'],menuName: '监测对象管理',backBtn: true,},hidden: true,},{path: '/userCenter',menuIdEx: '3 - 14',name: 'userCenter',component: () => import('@/views/userCenter/userCenter.vue'),meta: {title: '个人中心',icon: 'user',perms: ['assetsDetail'],menuName: '监测对象管理',backBtn: true,},hidden: true,},],},// 监测终端管理----------------------------------------------------------------//监测终端管理-终端管理{path: '/desktopAssistant',menuIdEx: '4',component: Layout,redirect: '/terminal',name: 'terminal',meta: {title: '监测终端管理',icon: '监测终端管理',perms: ['desktopAssistant'],menuName: '监测终端管理',},children: [//监测终端管理-应用管理{menuIdEx: '4 - 1',path: '/appControl',name: 'appControl',component: () => import('@/views/appControl/appControl.vue'),meta: {title: '应用管理',icon: '监测对象列表',perms: ['appControl'],menuName: '监测终端管理',},},{menuIdEx: '4 - 2',path: '/appControlDetail',name: 'appControlDetail',component: () => import('@/views/appControl/appControlDetail.vue'),meta: {title: '应用管理详情',icon: '监测对象列表',perms: ['appControlDetail'],menuName: '监测终端管理',backBtn: true,},hidden: true,},{menuIdEx: '4 - 3',path: '/terminal',name: 'terminal',component: () => import('@/views/terminal/terminal.vue'),meta: {title: '终端管理',icon: '监测对象列表',perms: ['terminal'],menuName: '监测终端管理',},},{menuIdEx: '4 - 4',path: '/terminalDetail',name: 'terminalDetail',component: () => import('@/views/terminal/terminalDetail.vue'),meta: {title: '终端详情',icon: '监测对象列表',perms: ['terminalDetail'],menuName: '监测终端管理',backBtn: true,},hidden: true,},//监测终端管理-消息通知{menuIdEx: '4 - 5',path: '/Notify',name: 'Notify',component: () => import('@/views/Notify/Notify.vue'),meta: {title: '消息通知',icon: '监测对象列表',perms: ['Notify'],menuName: '监测终端管理',},},{menuIdEx: '4 - 6',path: '/NotifyDetail',name: 'NotifyDetail',component: () => import('@/views/Notify/NotifyDetail.vue'),meta: {title: '消息通知详情',icon: '监测对象列表',perms: ['NotifyDetail'],menuName: '监测终端管理',backBtn: true,},hidden: true,},],},// 监测对象访控 =====================================================================================================================================================// 监测对象访控 - 访控策略{path: '/accessControl',name: 'accessControl',menuIdEx: '5',component: Layout,meta: {title: '监测对象访控',icon: '准入设置',perms: ['accessControl'],menuName: '监测对象访控',},children: [{menuIdEx: '5 - 1',path: '/nacStrategy',name: 'nacStrategy',component: () => import('@/views/nacControl/nacStrategy.vue'),meta: {title: '访控策略',icon: '监测对象列表',perms: ['nacStrategy'],menuName: '监测对象访控',},},{path: '/nacStrategyDetail',menuIdEx: '5 - 2',name: 'nacStrategyDetail',component: () => import('@/views/nacControl/nacStrategyDetail.vue'),meta: {title: '访控策略详情',icon: '准入设置',perms: ['nacStrategyDetail'],menuName: '监测对象访控',backBtn: true,},hidden: true,},{path: '/nacStrategyAddEdit',menuIdEx: '5 - 3',name: 'nacStrategyAddEdit',component: () => import('@/views/nacControl/nacStrategyAddEdit.vue'),meta: {title: '访控策略配置',icon: '准入设置',perms: ['nacStrategyAddEdit'],menuName: '监测对象访控',backBtn: true,},hidden: true,},// 监测对象访控 - 访问控制{path: '/nacJurisdiction',name: 'nacJurisdiction',menuIdEx: '5 - 4',component: () => import('@/views/nacControl/nacJurisdiction.vue'),meta: {title: '访问控制',icon: '监测对象列表',perms: ['nacJurisdiction'],menuName: '监测对象访控',},},{path: '/nacJurisdictionDetail',menuIdEx: '5 - 5',name: 'nacJurisdictionDetail',component: () => import('@/views/nacControl/nacJurisdictionDetail.vue'),meta: {title: '访问控制详情',icon: '访问控制',perms: ['nacJurisdictionDetail'],menuName: '监测对象访控',backBtn: true,},hidden: true,},{path: '/nacJurisdictionAddEdit',menuIdEx: '5 - 6',name: 'nacJurisdictionAddEdit',component: () =>import('@/views/nacControl/nacJurisdictionAddEdit.vue'),meta: {title: '访问控制配置',icon: '访问控制',perms: ['nacJurisdictionAddEdit'],menuName: '监测对象访控',backBtn: true,},hidden: true,},// 监测对象访控 - 特权名单{path: '/blackWhiteList',menuIdEx: '5 - 7',name: 'blackWhiteList',component: () => import('@/views/nacControl/blackWhiteList.vue'),meta: {title: '特权名单',icon: '监测对象列表',perms: ['blackWhiteList'],menuName: '监测对象访控',},},],},// 日志管理--------------------------------------------------// 日志管理-账户操作日志{path: '/logManage',menuIdEx: '6',component: Layout,redirect: '/accountlog',name: 'accountlog',meta: {title: '日志管理',icon: '日志管理',perms: ['logManage'],menuName: '日志管理',},children: [{path: '/BlockLog',name: 'BlockLog',menuIdEx: '6 - 1',component: () => import('@/views/nacControl/prevent-log.vue'),meta: {title: '监控访控日志',icon: '监测对象列表',perms: ['BlockLog'],menuName: '日志管理',},},{menuIdEx: '6 - 2',path: '/accountlog',name: 'accountlog',component: () => import('@/views/accountlog/accountlog.vue'),meta: {title: '账户操作日志',icon: '监测对象列表',perms: ['accountlog'],menuName: '日志管理',keepAlive: true,},},],},// 系统管理 ====================================================================================================================================================={menuIdEx: '7',path: '/systemSet',component: Layout,redirect: '/assetsSet/topoFind',name: 'systemSet',meta: {title: '系统管理',icon: '系统管理',perms: ['assetsSet'],menuName: '系统管理',exname: '',},children: [//系统管理 -// {//   menuIdEx: 4,//   path: '/assetsSet',//   component: Layout1,//   redirect: '/assetsSet/topoFind',//   name: 'assetsSet',//   meta: {//     title: '监测对象管理设置',//     icon: '监测对象列表',//     perms: ['assetsSet'],//     menuName: '系统管理',//     exname: '',//   },//   children: [//     {//       menuIdEx: 1,//       path: '/topoFind',//       name: 'topoFind',//       component: () => import('@/views/assets/findSet.vue'),//       meta: {//         title: '主动探测设置',//         icon: '主动探测设置',//         perms: ['topoFind'],//         menuName: '系统管理',//       },//     },//     {//       menuIdEx: 1,//       path: '/topoFindList',//       name: 'topoFindList',//       component: () => import('@/views/assets/topoFindList.vue'),//       meta: {//         title: '交换机联动设置',//         icon: '交换机联动设置',//         perms: ['topoFindList'],//         menuName: '系统管理',//       },//     },//     {//       menuIdEx: 1,//       path: '/analysis',//       name: 'analysis',//       component: () => import('@/views/assets/analysis.vue'),//       meta: {//         title: '监测对象探针列表',//         icon: '监测对象探针列表',//         perms: ['analysis'],//         menuName: '系统管理',//       },//     },//     {//       menuIdEx: 1,//       path: '/oidList',//       name: 'oidList',//       component: () => import('@/views/assets/oidList.vue'),//       meta: {//         title: '设备厂商OID表',//         icon: '设备厂商OID表',//         perms: ['oidList'],//         menuName: '系统管理',//       },//     },//     {//       menuIdEx: 1,//       path: '/featuresList',//       name: 'featuresList',//       component: () => import('@/views/assets/featuresList.vue'),//       meta: {//         title: '监测对象特征库',//         icon: '监测对象特征库',//         perms: ['featuresList'],//         menuName: '系统管理',//       },//     },//     {//       menuIdEx: 1,//       path: '/sipList',//       name: 'sipList',//       component: () => import('@/views/systemControl/sipList.vue'),//       meta: {//         title: 'SIP列表',//         icon: 'SIP列表',//         perms: ['sipList'],//         menuName: '系统管理',//       },//     },//     {//       menuIdEx: 1,//       path: '/icon',//       name: 'iconList',//       component: () => import('@/views/systemControl/iconList.vue'),//       meta: {//         title: '图标管理',//         icon: '图标管理',//         perms: ['iconList'],//         menuName: '系统管理',//       },//     },//   ],// },//系统管理 - 准入控制设置{path: '/nacParameter',menuIdEx: '7 - 1',// component: Layout,// redirect: '/nacParameter',meta: {title: '监测访控设置',icon: '监测对象列表',perms: ['nacParameter'],menuName: '系统管理',},name: 'nacParameter',component: () => import('@/views/nacControl/nacParameter.vue'),// children: [//   {//     path: '/nacParameter',//     name: 'nacParameter',//     component: () => import('@/views/nacControl/nacParameter.vue'),//     meta: {//       title: '准入控制设置',//       icon: '',//       perms: ['nacParameter'],//       menuName: '系统管理',//     },//   },// ],},{menuIdEx: '7 - 2',path: '/topoFind',name: 'topoFind',component: () => import('@/views/assets/findSet.vue'),meta: {title: '主动探测设置',icon: '主动探测设置',perms: ['topoFind'],menuName: '系统管理',},},{menuIdEx: '7 - 3',path: '/topoFindList',name: 'topoFindList',component: () => import('@/views/assets/topoFindList.vue'),meta: {title: '交换机联动设置',icon: '交换机联动设置',perms: ['topoFindList'],menuName: '系统管理',},},{menuIdEx: '7 - 4',path: '/analysis',name: 'analysis',component: () => import('@/views/assets/analysis.vue'),meta: {title: '监测探针设置',icon: '监测对象探针列表',perms: ['analysis'],menuName: '系统管理',},},//系统管理 - 账户管理{path: '/jurisdiction',menuIdEx: '7 - 5',component: Layout1,name: 'jurisdiction',meta: {title: '账号权限设置',icon: '监测对象列表',perms: ['jurisdiction'],menuName: '系统管理',exname: '',},children: [{menuIdEx: '7 - 5 - 1',path: '/user',name: 'User',component: () => import('@/views/system/user.vue'),meta: {title: '用户权限',icon: '用户管理',perms: ['userManage'],menuName: '系统管理',},},{menuIdEx: '7 - 5 - 2',path: '/role',name: 'Role',component: () => import('@/views/system/role'),meta: {title: '角色权限',icon: '角色管理',perms: ['roleManage'],menuName: '系统管理',},},{menuIdEx: '7 - 5 - 3',path: '/perm',name: 'Perm',component: () => import('@/views/system/perm'),meta: {title: '权限菜单',icon: '权限菜单',perms: ['jurisdictionManage'],menuName: '系统管理',},},],},//系统管理 - 级联管理// {//   path: '/levelControl',//   menuIdEx: 4,//   // component: Layout,//   meta: {//     title: '级联管理',//     icon: '监测对象列表',//     perms: ['levelControl'],//     menuName: '系统管理',//   },//   name: 'levelControl',//   component: () => import('@/views/systemControl/levelControl.vue'),//   // children: [//   //   {//   //     menuIdEx: 1,//   //     path: 'levelControl',//   //     name: 'levelControl',//   //     component: () => import('@/views/systemControl/levelControl.vue'),//   //     meta: {//   //       title: '级联管理',//   //       icon: '',//   //       perms: ['levelControl'],//   //       menuName: '系统管理',//   //     },//   //   },//   // ],// },//系统管理 - 系统维护{path: '/systemControl',menuIdEx: '7 - 6',// component: Layout,meta: {title: '系统维护',icon: '监测对象列表',perms: ['systemFix'],menuName: '系统管理',},name: 'setting',component: () => import('@/views/systemControl/setting.vue'),// children: [//   {//     menuIdEx: 1,//     path: 'setting',//     name: 'setting',//     component: () => import('@/views/systemControl/setting.vue'),//     meta: {//       title: '系统维护',//       icon: '',//       perms: ['systemFix'],//       menuName: '系统管理',//     },//   },// ],},//系统管理 - 系统授权{path: '/systemEmpower',menuIdEx: '7 - 7',// component: Layout,// redirect: '/systemControl',meta: {title: '系统授权',icon: '监测对象列表',perms: ['systemEmpower'],menuName: '系统管理',},name: 'systemEmpower',component: () => import('@/views/systemControl/systemEmpower.vue'),// children: [//   {//     path: '/systemEmpower',//     name: 'systemEmpower',//     component: () => import('@/views/systemControl/systemEmpower.vue'),//     meta: {//       title: '系统授权',//       icon: '',//       perms: ['systemEmpower'],//       menuName: '系统管理',//     },//   },// ],},//系统管理 - 提示页面设置{path: '/webCustomized',menuIdEx: '7 - 8',// component: Layout,// redirect: '/webCustomized',meta: {title: '提示页面设置',icon: '监测对象列表',perms: ['webCustomized'],menuName: '系统管理',},name: 'webCustomized',component: () => import('@/views/nacControl/webCustomized.vue'),// children: [//   {//     path: '/webCustomized',//     name: 'webCustomized',//     component: () => import('@/views/nacControl/webCustomized.vue'),//     meta: {//       title: '提示页面设置',//       icon: '',//       perms: ['webCustomized'],//       menuName: '系统管理',//     },//   },// ],},],},// 全局总览// {//   path: '/viewAll',//   menuIdEx: 1,//   component: LayoutNoLeftMenu,//   // redirect: '/homePage',//   children: [//     {//       path: '/viewAll',//       name: 'viewAll',//       component: () => import('@/views/viewAll/viewAll.vue'),//       meta: {//         title: '全局总览',//         icon: 'user',//         perms: ['viewAll'],//         menuName: '全局总览',//         keepAlive: true,//       },//     },//   ],// },{path: '/resetPassword',menuIdEx: '8',component: Layout,// redirect: '/systemControl',name: 'resetPassword',children: [{path: '/resetPassword',name: 'resetPassword',component: () => import('@/views/systemControl/resetPassword.vue'),meta: {title: '重置密码',icon: 'zhunrucanshu',perms: ['resetPassword'],menuName: '系统管理',backBtn: true,},hidden: true,},],hidden: true,},{ path: '*', name: '404', menuIdEx: '9', redirect: '/404', hidden: true },
]const createRouter = () =>new Router({// mode: 'history', // require service supportscrollBehavior: () => ({ y: 0 }),routes: constantRoutes,})const router = createRouter()// Detail see: https://github.com/vuejs/vue-router/issues/1234#issuecomment-357941465
export function resetRouter() {const newRouter = createRouter()router.matcher = newRouter.matcher // reset router
}export default router

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/4319.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

带纵深可跳跃横版闯关游戏模版

此项目是以《卡比猎人队》为蓝本开发的横版带纵深闯关游戏模版。内涵数据表配置文件。 购买链接&#xff1a; 微店购买链接 开发环境 开发引擎&#xff1a;CocosCreator3.6.3开发语言&#xff1a;TypeScript 包含的内容&#xff1a; 逻辑实现目录介绍&#xff08;game&am…

java面试Day18

1.什么是 MySQL 执行计划&#xff1f;如何获取执行计划并对其进行分析&#xff1f; MySQL 执行计划是指 MySQL 查询优化器生成的一份详细的查询执行计划&#xff0c;它展示了 MySQL 在执行查询时所采取的具体执行计划&#xff0c;包括表的访问顺序、数据读取方式、使用的索引、…

Elasticsearch:实用 BM25 - 第 3 部分:在 Elasticsearch 中选择 b 和 k1 的注意事项

这是系列文章的第三篇文章。之前的文章是&#xff1a; Elasticsearch&#xff1a;实用 BM25 - 第 1 部分&#xff1a;分片如何影响 Elasticsearch 中的相关性评分 Elasticsearch&#xff1a;实用 BM25 - 第 2 部分&#xff1a;BM25 算法及其变量 选择 b 和 k1 值得注意的是&…

Windows 引导启动流程详述(BIOS-UEFI)

Windows 启动流程详述 BIOS 和 UEFI 的由来BIOS 存在哪里BIOS 程序的功能BIOS 和 UEFI 的发展由来如何查看当前计算机是什么方式引导启动呢&#xff1f;Linux 下如何查看 BIOS 大小&#xff1f; 启动流程详述使用 BIOS 进行系统启动流程使用 UEFI 进行系统启动流程SEC阶段PEI阶…

2022 年第十二届 MathorCup 高校数学建模挑战赛D题思路(移动通信网络站址规划和区域聚类问题)

目录 一、前言 二、问题背景 三、问题 四、解题思路 &#xff08;1&#xff09;针对问题1&#xff1a; &#xff08;2&#xff09;针对问题2&#xff1a; &#xff08;3&#xff09;针对问题3&#xff1a; 五、附上几个典型代码 &#xff08;1&#xff09;K-means算法…

【Unity编辑器扩展】(三)PSD转UGUI Prefab, 一键拼UI解放美术/程序(完结)

工具效果&#xff1a; 第一步&#xff0c;把psd图层转换为可编辑的节点树&#xff0c;并自动解析UI类型、自动绑定UI子元素&#xff1a; 第二步, 点击“生成UIForm"按钮生成UI预制体 (若有UI类型遗漏可在下拉菜单手动点选UI类型)&#xff1a; 验证一键生成UI效果: 书接上…

SAP HANA使用SQL创建SCHEMA:

语法是 CREATE SCHEMA “<Schema_Name>” 使用图形方法创建 SAP HANA 表&#xff1a; 创建图形计算视图&#xff1a;

FFmpeg视频转码关键参数详解

1 固定码率因子crf&#xff08;Constant Rate Factor&#xff09; 固定码率因子&#xff08;CRF&#xff09;是 x264 和 x265 编码器的默认质量&#xff08;和码率控制&#xff09;设置。取值范围是 0 到 51&#xff0c;这其中越低的值&#xff0c;结果质量越好&#xff0c;同…

React Antd Form.List 组件嵌套多级动态增减表单 + 表单联动复制实现

Antd Form.List 组件嵌套多级动态增减表单 表单联动复制实现 一、业务需求 有一个页面的组件&#xff0c;其中一部分需要用到动态的增减 复制表单&#xff0c;然后就想起 了使用 Antd 的 Form.List 去完成这个功能。 这个功能的要求是&#xff1a; 首先是一个动态的表单&…

SQL-每日一题【178.分数排名】

题目 表: Scores 编写 SQL 查询对分数进行排序。排名按以下规则计算: 分数应按从高到低排列。 如果两个分数相等&#xff0c;那么两个分数的排名应该相同。 在排名相同的分数后&#xff0c;排名数应该是下一个连续的整数。换句话说&#xff0c;排名之间不应该有空缺的数字。 …

Linux:LAMP搭建(全源码包安装)

LAMP 就是 Linux Apache Mysql PHP/Python 目录 Linux安装 Apache安装 Mysql安装 安装PHP 安装PHP扩展包 编译安装PHP PHP 添加优化模块 测试网页协同工作 Linux安装 虚拟机安装 (1条消息) VMware&#xff1a;安装centos7_鲍海超-GNUBHCkalitarro的博客-CSD…

Mybatis-Plus学习1

mybatis-plus需要两个依赖&#xff0c;一个lombok&#xff0c;一个mybatis-plus <dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>3.5.1</version> </dependency> …