当前位置:首页 >> 半导体技术突破 >> 【vue_2】创建一个弹出权限不足的提示框,漫步者 s5.1

【vue_2】创建一个弹出权限不足的提示框,漫步者 s5.1

cpugpu芯片开发光刻机 半导体技术突破 6
文件名:【vue_2】创建一个弹出权限不足的提示框,漫步者 s5.1 【vue_2】创建一个弹出权限不足的提示框

定义了一个名为 getUserRole 的 JavaScript 函数,该函数接受一个参数 authorityId,根据这个参数的不同值返回相应的用户角色字符串。这段代码的目的是根据传入的 authorityId 值判断用户的角色,然后返回相应的角色名称。

如果 authorityId 的值等于 888,函数返回字符串 ‘超级管理员’。如果 authorityId 的值等于2,函数返回字符串 ‘游客’。如果 authorityId 的值等于 1000,函数返回字符串 ‘abc’。如果 authorityId 的值等于 1200,函数返回字符串 ‘测试人员’。如果 authorityId 的值等于 2000,函数返回字符串 ‘开发人员’。如果 authorityId 的值等于 3001,函数返回字符串 ‘def’。如果 authorityId 的值不属于上述任何一个特定的值,函数返回字符串 ‘其他角色’。 function getUserRole(authorityId) {if (authorityId === 888) {return '超级管理员';} else if (authorityId === 2) {return '游客';} else if (authorityId === 1000) {return 'abc';} else if (authorityId === 1200) {return '测试人员';} else if (authorityId === 2000) {return '开发人员';} else if (authorityId === 3001) {return 'def';} else {return '其他角色';}}

定义了一个名为 authority_message 的 JavaScript 箭头函数。该函数使用 Element UI 框架中的 ElMessage 组件显示一个警告消息,提示用户当前用户的权限不够。

const authority_message = () => {ElMessage({type: 'warning',message: '当前用户的权限不够'});};

上面这个 ElMessage是已经封装好的,是git-vue-admin框架自带的东西。

<div style="display: block;"><el-link v-if="![888,1000,1200,2000,3000,3001].includes(userStore.userInfo.authorityId)" class="link" type="primary" @click="authority_message"><h1>账号管理</h1></el-link><el-link v-else class="link" type="primary" @click="toTarget('person')"><h1>账号管理</h1></el-link></div>

上面这个userStore.userInfo.authorityId能够拿到对应当前权限人员的号码,如果是超级管理员,拿到的就是888。

console.log('111aqd',userStore.userInfo.authorityId);

可以通过上面这个看是否在控制台打印出有对应的号码。

v-if的逻辑是,如果拿到的数字不是在[888,1000,1200,2000,3000,3001]当中的话,就提示说该用户没有权限。 v-else的逻辑是,如果不满足v-if的条件,就跳转界面。

出现的问题:为什么底下的这些框框看起来高矮不一?并且当切换为超级管理员与测试人员的时候,底下的框框长度也不一样?

协助本站SEO优化一下,谢谢!
关键词不能为空
同类推荐
«    2025年12月    »
1234567
891011121314
15161718192021
22232425262728
293031
控制面板
您好,欢迎到访网站!
  查看权限
网站分类
搜索
最新留言
文章归档
网站收藏
友情链接