vue前端按钮显示隐藏_2019-10-25 vue前端按钮权限控制隐藏_阿尔法查理的博客-程序员秘密

技术标签： vue前端按钮显示隐藏

vue前端按钮权限控制隐藏

权限控制描述

如何实现

1、储存权限数据

2、权限判断方法

3、设置vue自定义指令

4、最终代码与效果

很多后台管理系统会用到权限管理，菜单权限比较好控制，按钮权限就复杂一些，本文介绍的就是按钮权限如何控制，用的是vue项目。

权限控制描述

前端需要根据后端传来的权限数据控制是否显示新增、编辑、删除(红框所示部分)功能。

130a9d91bb94

image.png

130a9d91bb94

在这里插入图片描述

菜单管理处设置的新增、删除、编辑权限参数如图红框所示部分

130a9d91bb94

image.png

如何实现

1、储存权限数据

首先将权限控制的数据储存到vuex或者sessionstorage中，或者全局变量。

如何获得权限数据并提交到vuex的博文

https://blog.csdn.net/weixin_44849078/article/details/89184039

2、权限判断方法

以新增按钮为例,因为设置的新增菜单权限参数为"line-add"，所以html标签如下，v-has为vue自定

本文链接：https://blog.csdn.net/weixin_35589827/article/details/113548943

原作者删帖不实内容删帖广告或垃圾文章投诉

智能推荐

java做微信支付notify_url异步通知服务端的写法_YtjinC的博客-程序员秘密

最近团队在接入微信支付，APP和JSAPI的接口都需要填写一个notify_url回调地址，但是坑爹的官方文档并没有找到JSAPI模式的java版的demo，所以不得不自己看文档写了一个接受微信异步通知的页面，并做相应的业务处理。直接上代码：<%/* * 功能：微信支付服务器异步通知页面作者：李小拐日期：2016年6月22日20:20:44 说明：以下代码只

华为手机卡在升级界面_华为安装升级包卡在5 华为手机如何刷机？_呆鸽的博客-程序员秘密

1，刷机工具刷机工具：点击下载去ROM之家下载喜欢的华为手机ROM包，或者在刷机精灵客户端的ROM市场中直接下载2，刷机前置条件手机电量充足，建议20%以上电量剩余。手机内存或外置SD卡至少有大于ROM包100M以上的剩余容量。3，刷机流程1)连接刷机精灵：首先打开刷机精灵，通过USB线连接手机，记得先打开USB调试模式哦，刷机精灵检测到有机型连接后，会自动给该机型装驱动，驱动安装成功之后，就会自...

小白也能看懂的 Java 异常处理_CSDN资讯的博客-程序员秘密

作者 |泰斗贤若如责编 | 伍杏玲出品 | CSDN（ID：CSDNnews）异常的简介在Java中，异常就是Java在编译、运行或运行过程中出现的错误。程序错误分为三种：编译错误、运...

qt-利用qCustomPlot绘制动态曲线_Know your exciting的博客-程序员秘密

一、本篇知识点1、qCustomPlot控件的加载2、qCustomPlot控件的常用属性和方法3、定时器的使用二、qCustomPlot控件的加载Q 客户图（qcustomplot）是用于绘图和数据可视化的 Qt C++小部件,此绘图库专注于制作好看、发布质量高的 2D 绘图、图表和图表，并为实时可视化应用提供高性能工具。1、qCustomPlot如何加载到项目中（1）下载文件https://www.qcustomplot.com/index.php/download根

oracle sql 取非,Oracle PL/SQL 过滤非数字字符_13661398245的博客-程序员秘密

背景：给同事做了个报表，使用时从EXCEL、网页等向报表中拷贝查询条件(局编)。用户反映查不出数据——调查后发现用户填的局编带有空格——随手加了TRIM又有查不出数据的情况——带有全角空格——用Replace替换全角空格还有查不到，调查发现可能混有换行、EXCEL中神秘的空白符等。处理：第一反应是让用户粘贴前先转贴到记事本中，“过滤”一下无效字符。简单、有效，但很不友好。解决：咨询后得知合理的局编...

io模型，mysql_aihuangzhi8131的博客-程序员秘密

多路复用IO(IO multiplexing) 多路复用就是调用select来统一管理多个连接强调： 1. 如果处理的连接数不是很高的话，使用select/epoll的web server不一定比使用multi-threading + blocking IO的web server性能更好，可能延迟还更大。select/epol...