Skip to content

CondorAuth

CondorAuth 是一个权限控制组件,用于根据用户权限动态显示或隐藏 UI 元素。该组件与权限存储(Pinia Store)集成,通过检查用户权限来控制插槽内容的渲染。

组件 Props

参数名类型默认值说明
permissionstring/string[]/undefinedundefined需要的权限标识。可以是单个权限字符串、权限数组,或 undefined(表示仅验证用户是否登录)

插槽 Props

组件向插槽传递以下数据:

属性名类型说明
user-permisstionsstring[]当前用户拥有的所有权限标识数组

基本用法

1. 单个权限控制

vue
<template>
  <CondorAuth permission="user:add">
    <NButton type="primary">添加用户</NButton>
  </CondorAuth>
</template>

<script setup lang="ts">
import CondorAuth from '@/components/CondorAuth.vue';
</script>

2. 多个权限控制

vue
<template>
  <CondorAuth :permission="['user:edit', 'user:update']">
    <NButton type="warning">编辑用户</NButton>
  </CondorAuth>
</template>
<script setup lang="ts">
import CondorAuth from '@/components/CondorAuth.vue';
</script>