最简单的Vue 按钮权限控制
2020/4/4 11:01:35
本文主要是介绍最简单的Vue 按钮权限控制,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!
Vue 按钮权限控制
关于vue按钮权限控制,最简单的不过与v-if。例如:
”v-if='scope.row.xxx === permission
大多数做法都是将判断命令挂载到Vue实例上。 除了使用v-if判断节点是否渲染,还有一种操作方式就是el.parentNode.removeChild(el)
本文讲一讲这两种的实现方式
先讲需求
需要对用户的增删改查权限做存储 在实际table中对用户的操作按钮进行隐藏或显示
开始
Vuex 存储permissionList
ps:此处的遍历只为处理后端返回数据
mainJs处理permissionList
将它挂载到实例上面
Vue.prototype.$_has = hasPermission
完成
在需要使用到权限控制的按钮中,仅需要在他的属性中加一条 v-if=$_has('permission')
实际上所有所有的按钮权限判断都是大同小异。都是很简单的if-else逻辑。要么在单独的页面中去写
v-if
,要么就全局处理函数。
感谢阅读,如果你有更好的实现方式,可以写在评论里面哦~~~
本文使用 mdnice 排版
这篇关于最简单的Vue 按钮权限控制的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!
- 2024-10-04package.json 文件位置在哪?-icode9专业技术文章分享
- 2024-10-01Craco.js学习:从入门到实践指南
- 2024-10-01Create-React-App学习:入门与实践指南
- 2024-10-01CSS-in-JS学习:从入门到实践指南
- 2024-09-30JSX语法学习:从入门到初步掌握
- 2024-09-30Mock.js学习:入门教程与实战演练
- 2024-09-30React Hooks学习:从入门到实践
- 2024-09-30受控组件学习:React中的基础入门教程
- 2024-09-29JS定时器教程:初学者必看指南
- 2024-09-29JS对象教程:初学者的全面指南