Element-ui导航组件：NavMenu导航HighLight高亮设置
1. 文件navMenu.vue，部分代码参考：
<template><div class="nav-menu"><!--:route="{path: '/area'}"--><el-menu:default-active="$route.path"class="el-menu-demo"mode="horizontal"@select="handleSelect"background-color="#545c64"text-color="#fff"active-text-color="#ffd04b" router><el-menu-item index="/"><img src="../../../static/images/logo.png"/></el-menu-item><el-menu-item index="/index">首页2</el-menu-item><el-submenu index="2"><template slot="title">我的工作台</template><el-menu-item index="/job">职位申请</el-menu-item><el-menu-item index="/area">区域选择</el-menu-item><el-submenu index="5"><template slot="title">表格</template><el-menu-item index="/table/base">基础数据填充</el-menu-item><el-menu-item index="/table/horse">带斑马纹表格</el-menu-item><el-menu-item index="/table/border">带边框表格</el-menu-item><el-menu-item index="/table/rowclassname">带状态表格</el-menu-item><el-menu-item index="/table/fixedheight">固定列、表头（文字操作）</el-menu-item><el-menu-item index="/table/maxheight">流体高度（文字操作）</el-menu-item><el-menu-item index="/table/moreth">多级表头（表头嵌套）</el-menu-item><el-menu-item index="/table/choose">单选、多选</el-menu-item><el-menu-item index="/table/sort">排序</el-menu-item><el-menu-item index="/table/tagselect">筛选（div模拟selelct）</el-menu-item><el-menu-item index="/table/columntemplate">自定义列模板（按钮操作）</el-menu-item><el-menu-item index="/table/opentr">展开行</el-menu-item></el-submenu><el-submenu index="6"><template slot="title">Upload上传</template><el-menu-item index="/upload/click">点击上传</el-menu-item><el-menu-item index="/upload/userheadpic">用户头像上传</el-menu-item><el-menu-item index="/upload/photowall">照片墙</el-menu-item><el-menu-item index="/upload/thumblist">图片列表缩略图</el-menu-item><el-menu-item index="/upload/docslist">上传文件列表控制</el-menu-item><el-menu-item index="/upload/bydrag">拖拽上传</el-menu-item><el-menu-item index="/upload/byhand">手动上传</el-menu-item></el-submenu><el-menu-item index="2-1">移动端</el-menu-item><el-menu-item index="2-2">微信小程序</el-menu-item><el-submenu index="2-3"><template slot="title">PC 端</template><el-menu-item index="2-3-1">案例1</el-menu-item><el-menu-item index="2-3-2">案例2</el-menu-item><el-menu-item index="2-3-3">案例3</el-menu-item></el-submenu></el-submenu><el-menu-item index="3" disabled>消息中心</el-menu-item><el-menu-item index="4"><a href="javascript:;" target="_blank" title="target无效">订单管理</a></el-menu-item><el-menu-item index="/login">登录</el-menu-item><el-menu-item index="/register">注册</el-menu-item></el-menu></div></template>
在上述的.vue文件中，并不需要设置《script》和《style》部分！
唯一需要注意的:(
<el-menu>开始标签中设置的两处代码，如下):default-active="$route.path"router
附件1：效果图预览：
附件2：文件路径和路由设置，代码截图如下：
设置了上述的两处代码，接着对
<el-menu-item index="" >配置一下path路径(相关路由配置截图如下)，就可以实现页面与navMenu导航组件的对应栏目高亮显示了。
以上就是关于“ Element-ui导航组件NavMenu导航高亮设置 ”的全部内容。
