Роли и разрешения с Spat ie, Laravel и VueJs - PullRequest
Новая
       16

Роли и разрешения с Spat ie, Laravel и VueJs

0 голосов
/ 12 июля 2020

Я использую Laravel и VueJs для своего приложения, и я хочу интегрировать раздел для ролей и разрешений, и для этого я использую Spat ie.

В приложении у каждого пользователя может быть несколько ролей (например: администратор, учитель, редактор), и каждая роль имеет определенные разрешения.

Я пробовал кое-что из здесь , ответ Шуйи, но я получаю некоторые ошибки.

Вопрос в том, как я могу проверить роли в VueJS?

Контроллер 

<?php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

class TeachersController extends Controller
{
    function check($permissionName) {
        if (! Auth::user()->hasPermissionTo($permissionName)) {
             abort(403);
        }
        return response('', 204);
     }
}

web. php

Route::group(['middleware' => 'auth'], function () {
   Route::get('/permission/{permissionName}', 'PermissionController@check');
});

приложение. js

Vue.mixin("can", (permissionName) => {
    let hasAccess;
    axios.get(`/permission/${permissionName}`)
        .then(() => {
            hasAccess = true;
        })
        .catch(() => {
            hasAccess = false;
        });
    return hasAccess;
});

приложение vue

<template>
    <button v-if="can('write-stuff')">Just a test!</button>
</template>

Свойство или метод can не определены в экземпляре, но на них ссылаются во время рендеринга. Убедитесь, что это свойство является реактивным либо в параметре данных, либо для компонентов на основе классов, инициализировав свойство. См .: https://vuejs.org/v2/guide/reactivity.html#Declaring -реактивные-свойства .

1 Ответ

0 голосов
/ 12 июля 2020

Если вы не определяете миксин как глобальный, вы должны внедрить его в компонент, который вы хотите использовать, как описано в Vue документах Mixins

За регистрацию компонента: 

// define a mixin object
var myMixin = {
  created: function () {
    this.hello()
  },
  methods: {
    hello: function () {
      console.log('hello from mixin!')
    }
  }
}

// define a component that uses this mixin
var Component = Vue.extend({
  mixins: [myMixin]
})

Глобальная регистрация (будет доступна во всех компонентах) 

// inject a handler for `myOption` custom option
Vue.mixin({
  created: function () {
    var myOption = this.$options.myOption
    if (myOption) {
      console.log(myOption)
    }
  }
})

new Vue({
  myOption: 'hello!'
})
...