koa mysql 按钮级权限_Vue 指令实现按钮级别权限管理功能

在项目中经常有需求要根据用户的权限对界面上的元素进行控制，这里介绍了一直简单的实现，仅供参考。

当前用户的权限列表储存在 store 里，也可以是其他地方。

指令

// src/directives/permission.js

import Vue from 'vue';

import store from '@/store';

import {get} from '@/utils';

// 是否有权限

const hasPermission = userPermission => {

let userPermissionList = Array.isArray(userPermission) ? userPermission : [userPermission];

// 当前用户的权限列表

let permissionList = get(store, 'getters["user/permission"]', []);

return userPermissionList.some(e => permissionList.includes(e));

};

// 指令

Vue.directive('per', {

bind: (el, binding, vnode) => {

if (!hasPermission(binding.value)) {

el.parentNode.removeChild(el);

}

});

// 全局判断方法

Vue.prototype.$_has = hasPermission;

使用方法

在 mian.js 引入

admin 可见

是否为admin：{{$_has('admin')}} //true

总结

以上所述是小编给大家介绍的Vue 指令实现按钮级别权限管理功能，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！

koa mysql 按钮级权限_Vue 指令实现按钮级别权限管理功能相关推荐

SpringBoot整合SpringSecurity实现权限控制（五）：用户管理
系列文章目录 <SpringBoot整合SpringSecurity实现权限控制(一):实现原理> <SpringBoot整合SpringSecurity实现权限控制(二):权限数据 ...
Vue自定义指令实现按钮级权限
在很多后台管理系统中,常常需要做按钮权限控制. 当然我们可以使用v-if来实现,不过这样做,每个页面都要获取一次权限信息,代码往往很冗余. 接下来我们将封装自定义指令,来实现按钮级的权限控制. 一.先 ...
前端权限设计实现——按钮级
一直对权限设计很感兴趣,以前写后端代码时,搞过权限设计,挺有意思的,但是前端按钮级别的权限设计了解过,却还没具体实现过,最近项目打算对权限进行细分,先研究下前端的权限吧. 权限设计的出发点在于,让不同 ...
WinForm/MIS项目开发之中按钮级权限实践
一.前言 AgileEAS.NET SOA 中间件平台是一款基于基于敏捷并行开发思想和Microsoft .Net构件(组件)开发技术而构建的一个快速开发应用平台.用于帮助中小型软件企业建立一条适合市 ...
路由到另外一个页面_一个简单的Vue按钮级权限方案
在年初开发一个中后台管理系统,功能涉及到了各个部门(产品.客服.市场等等),在开始的版本中,我和后端配合使用了花裤衩手摸手系列的权限方案,前期非常nice,但是慢慢的随着功能增多.业务越来越复杂,就变 ...
mysql 列级权限授予用户_mysql 用户及权限管理小结
MySQL 默认有个root用户,但是这个用户权限太大,一般只在管理数据库时候才用.如果在项目中要连接 MySQL 数据库,则建议新建一个权限较小的用户来连接. 在 MySQL 命令行模式下输入如下命 ...
为什么函数lamda显示权限不足_一个简单的Vue按钮级权限方案
在年初开发一个中后台管理系统,功能涉及到了各个部门(产品.客服.市场等等),在开始的版本中,我和后端配合使用了花裤衩手摸手系列的权限方案,前期非常nice,但是慢慢的随着功能增多.业务越来越复杂,就变 ...
Vue 进阶系列丨自定义指令实现按钮权限功能
Vue 进阶系列教程将在本号持续发布,一起查漏补缺学个痛快!若您有遇到其它相关问题,非常欢迎在评论中留言讨论,达到帮助更多人的目的.若感本文对您有所帮助请点个赞吧! 2013年7月28日,尤雨溪第一次 ...
mysql关于菜单权限的设计_管理系统之权限的设计和实现
本文主要想对前端权限管理功能实现做一个分享,所以并不会对后台管理的框架结构做太详细介绍,如果有朋友对其他有兴趣可以留言. 基本设计和分析前端 vue + elementui 服务端: node + ...

koa mysql 按钮级权限_Vue 指令实现按钮级别权限管理功能

koa mysql 按钮级权限_Vue 指令实现按钮级别权限管理功能相关推荐

最新文章

热门文章