若依权限v-hasPermi

1.最近在写后台管理项目时要使用到若依的权限管理，也就是标题中所说的 v-hasPermi，试了又试发现 v-hasPermi 只能隐藏按钮，像一些标签是不能隐藏的，比如说el-table中的el-table-column

如下图所示：在这里，我所理解的v-hasPermi，相当于v-if，（当条件判断为false的时候进行销毁元素），可又和v-if不太一样，话不多说，直接上方法，教你如何使用v-hasPermi进行标签的隐藏

2.要想进行标签的权限隐藏，可以配合v-if进行
//在若依权限管理中我们可以使用以下的方法进行判断是否有权限，如有权限则为true，反之为false

this.$auth.hasPermi('production:semi:registeExport')
 
//既然拿到了判断权限的标识钥匙，那接下来就好办了
 <el-table-column
        label="操作"
        align="center"
        //直接在标签上使用v-if来进行判断是否开启权限，即可实现标签的权限隐藏
        v-if="$auth.hasPermi('production:semi:registeExport')"
        width="200"
      >
 </el-table-column>

总结：关键 this.$auth.hasPermi('production:semi:registeExport') 这行代码可以判断是否是开启权限，再配合v-if进行标签的权限隐藏即可。

使用权限字符串 v-hasPermi

// 单个
<el-button v-hasPermi="['system:user:add']">存在权限字符串才能看到</el-button>
// 多个
<el-button v-hasPermi="['system:user:add', 'system:user:edit']">包含权限字符串才能看到</el-button>

使用角色字符串 v-hasRole

// 单个
<el-button v-hasRole="['admin']">管理员才能看到</el-button>
// 多个
<el-button v-hasRole="['role1', 'role2']">包含角色才能看到</el-button>

记录一下使用若依的权限使用 - 前端白雪 - 博客园 (cnblogs.com)