vue-element-admin搭建项目中实现点击左侧菜单栏获取当前菜单的ID

?

1 2 3

1.vue-element-admin搭建项目中实现点击左侧菜单栏获取当前菜单的ID，我目前主要是用来做按钮权限功能；点击菜单获取当前菜单的按钮权限； 具体实现方法： 1.在src/layout/components/Sidebar/index.vue增加  watch: 方法来检测路由变化获取当前信息；

　

?

1	2.打印console.log('route watch ====>', val)看是否有自己需要的信息 （目前我需要ID信息，打印出来没有菜单的ID）因此store/modules/permission.js中generaMenu中将需要的ID传入meta中，那么打印console.log('route watch ====>', val)就可以获取到ID

　

?

1	在src/layout/components/Sidebar/index.vue在watch中调用后端提供的根据菜单ID获取的当前菜单的按钮信息

　　

4.在项目utils/index中写公共方法看按钮是否有权限

6.在页面引用即可

?

1 2 3 4 5 6 7 8 9 10 11

import { formatDate, hasPermissionBtn } from '@/utils' 在methods：中写方法 /**      * 权限限制展示  */  hasPerms(perms) {     return hasPermissionBtn(perms)  }, 在所需要的按钮增加v-if判断 例如： <el-button v-if="hasPerms('newlyAdded')" type="primary" style="float:right;width:100px;" @click="AddEvent">新增</el-button>