@0devco/v-permit 中文文档教程

发布于 6年前 浏览 27 项目主页 更新于 3年前

v-permit

Vue 角色 权限 (ACL) ⇆ [ Laravel+ Rails] ⇆ 0devco

install

npm i @0devco/v-permit
# yarn
yarn add @0devco/v-permit

import > App.js

import Vpermit from '@0devco/v-permit';
Vue.use(Vpermit);

use v-permit for ACL

<template lang="html">
  <div class="">
    <div class="" v-permit="hasAllPermission('a1','edit-post','delete-post') || v_permit.a1">
      <h1>done! all permission exist </h1>
    </div>
    <div v-permit="hasAllPermission('b43','edit-post','delete-post','create-user') || v_permit.b43">
      <h1>don't have create user permissions </h1>
    </div>
    <div v-permit="hasAnyPermission('c21','edit-post','delete-post','create-user') || v_permit.c21">
      <h1>don't have create user permissions but hasAnyPermission exists  </h1>
    </div>
  </div>
</template>

<script>
import permitMixins from '@0devco/v-permit/mixins/permit'
export default {
  data () {
    return {
      msg: 'v-permit',
      // json format
      authPermissionURI: "https://raw.githubusercontent.com/0devco/v-permit/master/authUserPermissions.json"

    }
  },
  mixins: [permitMixins]
}
</script>

<style lang="css" scoped >

</style>

Tips & stricly follow

~ v-permit="hasAnyPermission('c21','edit-post','delete-post','create-user') || v_permit.c21"

  • first element is check id (ex c21)
  • check id will be unique
  • you can use check id ( a1 → a50 ,b1 → b50, c1 → c50, d1 → d50 , e1 → e50 )

v-permit

???? Vue Roles & Permissions (ACL) ⇆ [ Laravel+ Rails] ⇆ 0devco

install

npm i @0devco/v-permit
# yarn
yarn add @0devco/v-permit

import > App.js

import Vpermit from '@0devco/v-permit';
Vue.use(Vpermit);

use v-permit for ACL

<template lang="html">
  <div class="">
    <div class="" v-permit="hasAllPermission('a1','edit-post','delete-post') || v_permit.a1">
      <h1>done! all permission exist </h1>
    </div>
    <div v-permit="hasAllPermission('b43','edit-post','delete-post','create-user') || v_permit.b43">
      <h1>don't have create user permissions </h1>
    </div>
    <div v-permit="hasAnyPermission('c21','edit-post','delete-post','create-user') || v_permit.c21">
      <h1>don't have create user permissions but hasAnyPermission exists  </h1>
    </div>
  </div>
</template>

<script>
import permitMixins from '@0devco/v-permit/mixins/permit'
export default {
  data () {
    return {
      msg: 'v-permit',
      // json format
      authPermissionURI: "https://raw.githubusercontent.com/0devco/v-permit/master/authUserPermissions.json"

    }
  },
  mixins: [permitMixins]
}
</script>

<style lang="css" scoped >

</style>

Tips & stricly follow

~ v-permit="hasAnyPermission('c21','edit-post','delete-post','create-user') || v_permit.c21"

  • first element is check id (ex c21)
  • check id will be unique
  • you can use check id ( a1 → a50 ,b1 → b50, c1 → c50, d1 → d50 , e1 → e50 )

    我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
    原文