vue 組件中的 Laravel 門授權

Question

使用 Laravel 之門 / 授權。 我可以通過簡單地在我的刀片模板中使用它..

@can('edit-post')
    <button></button>
@endcan

但是，如果按鈕在 vue 組件內，我該如何應用 @can 來授權用戶？

Answer 1

將您的權限從 laravel 加載到全局 javascript 變量，或者您可以使用 ajax 調用加載它

window.Laravel = <?php echo json_encode([
                'csrfToken' => csrf_token(),
                'userId' => Auth::user()->id,
                'permissions' => Auth::user()->permissions()->pluck('name')->toArray()
            ]); ?>

然后創建一個 vue 指令

Vue.directive('can', function (el, binding) {
  return Laravel.permissions.indexOf(binding) !== -1;
})

現在將其應用於您的按鈕

<button v-can="editStuff">You can edit this thing</button>

你可以在這里查看https://laracasts.com/discuss/channels/vue/roles-and-permissions-in-vue

Answer 2

使用 vue 內聯模板。 可以容納刀片功能..