在 vue 中使用 Laravel-permission 的 @can 标签

1. 在需要权限校验的 model 中新增方法

public function getAllPermissionsAttribute() { $permissions = []; foreach (Permission::all() as $permission) { if (Auth::user()->can($permission->name)) { $permissions[] = $permission->name; } } return $permissions; }

2. 在 app.blade 中存储当前用户的所有权限

<script> @auth window.Permissions = @json(Auth::user()->allPermissions); @else window.Permissions = []; @endauth </script>

3. 新建 vue component

<script> export default { methods: { $can(permissionName) { return Permissions.indexOf(permissionName) !== -1; } } }; </script>

4. 在 app.js 注册 vue 组件

import auth from './components/AuthComponent';\ Vue.mixin(auth);

5. 在vue中使用

 <a v-if="$can('admin.admins.delete')" class="text-danger" @click="dataDelete(admin)">
本作品采用《CC 协议》,转载必须注明作者和本文链接
沉迷学习,无法自拔
《L05 电商实战》
从零开发一个电商项目,功能包括电商后台、商品 & SKU 管理、购物车、订单管理、支付宝支付、微信支付、订单退款流程、优惠券等
《L02 从零构建论坛系统》
以构建论坛项目 LaraBBS 为线索,展开对 Laravel 框架的全面学习。应用程序架构思路贴近 Laravel 框架的设计哲学。
讨论数量: 4

在 foreach 内取 Auth::user() 性能较差,可以提到外面。其实不应该这么做,应该直接读取出当前用户的所有权限。

6年前 评论

个人觉得这样写会更好

public function getAllPermissionsAttribute() { $permissions = $this->getAllPermissions(); $permission_names = []; collect($permissions)->map(function ($permission) use (&$permission_names) { $permission_names[] = $permission->name; }); return $permission_names; }

效果:

file

6年前 评论

@johnlui 是的,@zhouzishu 的方法更好 :smiley:

6年前 评论