Laravel - Jetstream (InertiaJS) - 在顶部 header 菜单中使用守卫 (AppLayout.vue)
Laravel - Jetstream (InertiaJS) - using guards in the top header menu (AppLayout.vue)
如何使用 guards 添加特定的 admin 菜单条目 使用 guards?我知道我可以像 docs 提到的那样从控制器传递 guard-“data” 来查看:
class UsersController extends Controller
{
public function index()
{
return Inertia::render('Users/Index', [
'can' => [
'create_user' => Auth::user()->can('users.create'),
],
'users' => User::all()->map(function ($user) {
return [
'first_name' => $user->first_name,
'last_name' => $user->last_name,
'email' => $user->email,
//THIS BELOW IS THE GUARD-DATA
'can' => [
'edit_user' => Auth::user()->can('users.edit', $user),
]
];
}),
]);
}
}
这里的问题是 AppLayout.vue 文件的控制器在哪里,以便我可以完成此操作?
在这种情况下,我建议您通过 HandleInertiaRequests.php
文件共享 guards/permissions。我已经使用 spatie/permissions
来管理中间件。
public function share(Request $request)
{
return array_merge(parent::share($request), [
'auth' => [
'user' => [
'id' => $request->user()->id ?? '',
'name' => $request->user()->name ?? '',
'permissions' => $request->user() ?
$request->user()->getPermissionNames() : '',
],
]
}
您可以在 vue
模板中以 $page.props.auth.user.permissions
的形式轻松访问此数据。
<template>
<div v-if="can('edit-post')">
//Edit Post
<div>
<template>
<script>
methods:{
can(permission){
// Check Permissions
let data = this.$page.props.auth.user.permissions
.filter((ability) => ability === permission);
return data.length > 0 ? true : false;
}
}
<script>
如何使用 guards 添加特定的 admin 菜单条目 使用 guards?我知道我可以像 docs 提到的那样从控制器传递 guard-“data” 来查看:
class UsersController extends Controller
{
public function index()
{
return Inertia::render('Users/Index', [
'can' => [
'create_user' => Auth::user()->can('users.create'),
],
'users' => User::all()->map(function ($user) {
return [
'first_name' => $user->first_name,
'last_name' => $user->last_name,
'email' => $user->email,
//THIS BELOW IS THE GUARD-DATA
'can' => [
'edit_user' => Auth::user()->can('users.edit', $user),
]
];
}),
]);
}
}
这里的问题是 AppLayout.vue 文件的控制器在哪里,以便我可以完成此操作?
在这种情况下,我建议您通过 HandleInertiaRequests.php
文件共享 guards/permissions。我已经使用 spatie/permissions
来管理中间件。
public function share(Request $request)
{
return array_merge(parent::share($request), [
'auth' => [
'user' => [
'id' => $request->user()->id ?? '',
'name' => $request->user()->name ?? '',
'permissions' => $request->user() ?
$request->user()->getPermissionNames() : '',
],
]
}
您可以在 vue
模板中以 $page.props.auth.user.permissions
的形式轻松访问此数据。
<template>
<div v-if="can('edit-post')">
//Edit Post
<div>
<template>
<script>
methods:{
can(permission){
// Check Permissions
let data = this.$page.props.auth.user.permissions
.filter((ability) => ability === permission);
return data.length > 0 ? true : false;
}
}
<script>