若依自定义指令v-hasRole在el-table和el-row失效

在项目中通常运用若依自定义指令判断角色身份执行对应的逻辑，进行角色权限控制，比如我在这里可以实现一个自定义权限当当前登录的用户角色是教师时，就会显示班级的多选框表单，其他的角色登录则不会显示。

但是当碰上el-table表格时，v-hasRole就会失效，这时候当当前登录的用户角色是教师时也不会显示了，原因如下

1. 虚拟 DOM 差异：Element UI 的表格和布局组件使用虚拟 DOM 渲染，可能绕过自定义指令的处理
2. 指令作用域：自定义指令可能在组件内部无法访问到正确的 Vue 实例上下文

方案1：用到v-if去解决，控制它是否渲染

方案2：在表格项中使用 v-hasRole 结合 template 标签

<el-table-column prop="operation" label="操作">
  <template #default="{ row }">
    <el-button 
      v-hasRole="['admin']"
      @click="handleEdit(row)">
      编辑
    </el-button>
  </template>
</el-table-column>