elementUI 动态渲染三级菜单

发布时间:2020-06-26 00:48:34 作者:xxxpjgl
来源:网络 阅读:2170

elementUI 动态渲染三级菜单
后台传的数据为

menuList: [

{

name: "首页",

pid: 0,

id: 28,

url: "/main"

},

{

name: "实时监测",

pid: 0,

id: 29,

url: "/monitoring",

childNode: [

{

name: "实时监测首页",

pid: 29,

id: 34,

url: "/monitoringHomepage"

},

{

name: "自动消防设施系统",

pid: 29,

id: 35,

url: "/fireSystems"

},

// {

// name: "电气火灾监控系统",

// pid: 29,

// id: 36,

// url: "/electricFireMonitorSystem"

// },

{

name: "液位(压)监控系统",

pid: 29,

id: 37,

url: "/levelMonitoring"

},

{

name: "气体报警系统",

pid: 29,

id: 38,

url: "/gasAlarm"

},

{

name: "充电桩监控系统",

pid: 29,

id: 39,

url: "/ChargingPileMonitoring"

},

// {

// name: "物联网关系统",

// pid: 29,

// id: 40,

// url: "/InternetThings"

// }

]

},

{

name: "远程可视",

pid: 0,

id: 30,

url: "/remoteViewing",

childNode: [

{

name: "远程可视",

pid: 30,

id: 120,

url: "/remoteViewing"

}

]

},

{

name: "日常管理",

pid: 0,

id: 31,

url: "/dailyManagement",

childNode: [

{

name: "巡查管理",

pid: 31,

id: 41,

url: "/patrolManagement",

childNode: [

{

name: "巡查详情",

pid: 41,

id: 48,

url: "/patroDetail"

},

{

name: "巡查统计",

pid: 41,

id: 49,

url: "/patroStatistics"

}

]

},

// {

// name: "培训演练",

// pid: 31,

// id: 42,

// url: "/trainManoeuvre",

// childNode: [

// {

// name: "培训任务",

// pid: 42,

// id: 50,

// url: "/trainTask"

// },

// {

// name: "考试任务",

// pid: 42,

// id: 51,

// url: "/examTask"

// },

// {

// name: "演练任务",

// pid: 42,

// id: 52,

// url: "/manoeuvreTask"

// }

// ]

// },

{

name: "消控管理",

pid: 31,

id: 43,

url: "/controlSupervisor",

childNode: [

{

name: "在岗监控",

pid: 43,

id: 53,

url: "/siteMonitoring"

},

{

name: "查岗记录",

pid: 43,

id: 54,

url: "/siteRecord"

},

{

name: "消控值班考勤记录",

pid: 43,

id: 55,

url: "/checkRecord"

}

]

},

{

name: "隐患处理",

pid: 31,

id: 44,

url: "/dangerDeal",

childNode: [

{

name: "消防设备故障",

pid: 44,

id: 56,

url: "/facilitiesTrouble"

},

// {

// name: "告警处理",

// pid: 44,

// id: 57,

// url: "/alarmDeal"

// },

{

name: "巡查上报隐患",

pid: 44,

id: 58,

url: "/alarmReport"

}

]

},

// {

// name: "操作日志",

// pid: 31,

// id: 45,

// url: "/dailyMaintenance",

// childNode: [

// {

// name: "平台操作日志",

// pid: 45,

// id: 123,

// url: "1"

// },

// {

// name: "设备操作日志",

// pid: 45,

// id: 125,

// url: "2"

// }

// ]

// }

]

},

{

name: "数据分析",

pid: 0,

id: 32,

url: "/dataAnalysis",

childNode: [

{

name: "历史数据",

pid: 32,

id: 46,

url: "/historicalData",

childNode: [

{

name: "报警日志",

pid: 46,

id: 60,

url: "alarmLog"

},

{

name: "设备运行数据",

pid: 46,

id: 61,

url: "/equipmentOperatingData"

},

{

name: "隐患日志",

pid: 46,

id: 62,

url: "/hiddenLog"

},

{

name: "周报统计",

pid: 46,

id: 63,

url: "/weeklyStatistics"

},

{

name: "月报统计",

pid: 46,

id: 64,

url: "/monthlyStatistics"

},

{

name: "年报统计",

pid: 46,

id: 65,

url: "/annualReportStatistics"

}

]

},

{

name: "分析研制",

pid: 32,

id: 47,

url: "/AnalysisDevelopment",

childNode: [

{

name: "统计分析总览 ",

pid: 47,

id: 66,

url: "/statisticalAnalysisOverview"

},

{

name: "报警统计分析",

pid: 47,

id: 67,

url: "/alarmStatisticsAnalysis"

},

{

name: "设备状态统计分析",

pid: 47,

id: 68,

url: "/equipmentConditionAnalysis"

},

{

name: "日常管理分析",

pid: 47,

id: 69,

url: "/dailyManagementAnalysis"

}

]

}

]

}

],

路由配置为

elementUI 动态渲染三级菜单
elementUI 动态渲染三级菜单

推荐阅读:
  1. ElementUI Tree树形控件怎么用
  2. vue+elementUI动态生成面包屑导航教程

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

navbar nt

上一篇:多进程与多线程的选择

下一篇:ide找不到run选项怎么解决

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》