VUE-element-admin之配置多级路由菜单

简介: VUE-element-admin之配置多级路由菜单

步骤:
routers.js中添加如下代码:
在这里插入图片描述

{
    path: '/usermanagement', 
    alwaysShow: true, //是否显示父级:如果为false则只显示最内层菜单(默认false)
    component: Layout,
    hidden: false, //是否显示
    redirect: 'noredirect',
    name: '用户管理',
    meta: { title: '用户管理', icon: 'Steve-Jobs', affix: false, noCache: true },
    //affix:固定标签(不可删除)
    children: [
      {
        path: '/usermanagement/client',
        component: (resolve) => require(['@/views/usermanagement/client'], resolve),
        name: '客户管理',
        meta: { title: '客户管理', icon: 'people' }
      }
    ]
  }

效果图:
在这里插入图片描述
注意:本地配置路由只针对公用菜单,如果牵扯到权限就要动态配置菜单存入数据库。

相关文章
|
10天前
|
JavaScript
青戈大佬安装Vue,无Eslint安装版,vue2安装,vue2无eslint,最简单配置Vue安装资料
青戈大佬安装Vue,无Eslint安装版,vue2安装,vue2无eslint,最简单配置Vue安装资料
|
9天前
|
JavaScript 网络架构
vue3 【提效】自动路由(含自定义路由) unplugin-vue-router 实用教程
vue3 【提效】自动路由(含自定义路由) unplugin-vue-router 实用教程
48 0
vue3 【提效】自动路由(含自定义路由) unplugin-vue-router 实用教程
|
14天前
|
JavaScript
学习和分享关于 Vue.js 的路由(vue-router)
学习和分享关于 Vue.js 的路由(vue-router)
19 2
|
14天前
|
JavaScript
vue 自动注册路由
vue 自动注册路由
18 1
|
18天前
|
JavaScript
|
17天前
|
JavaScript 前端开发 程序员
探索Vue.js宝库:解锁基础知识与实用技能之门(1. 数据绑定与响应式 2. 条件与循环 3. 组件化开发;1. 路由管理与导航 2. 状态管理与Vuex 3. Vue.js的生命周期)
探索Vue.js宝库:解锁基础知识与实用技能之门(1. 数据绑定与响应式 2. 条件与循环 3. 组件化开发;1. 路由管理与导航 2. 状态管理与Vuex 3. Vue.js的生命周期)
22 1
|
4天前
|
JavaScript
【vue】 vue如何根据不同路由地址更改页面的标题
【vue】 vue如何根据不同路由地址更改页面的标题
5 0
|
4天前
|
JavaScript
【vue】 vue中判断路由变化 | 监听路有变化
【vue】 vue中判断路由变化 | 监听路有变化
8 0
|
10天前
|
JavaScript
Vue2和Vue3的安装,vue2的安装和初始化配置
Vue2和Vue3的安装,vue2的安装和初始化配置
|
11天前
|
JavaScript 数据安全/隐私保护
vue实战——路由访问权限【详解】
vue实战——路由访问权限【详解】
10 0

相关实验场景

更多