自定义 TabBar 说明
概述
- 采用 uni-app 自定义 TabBar,实现按角色(roleName)动态隐藏“教务”入口。
- roleName 从登录接口返回,已存储在本地:
backend-role-name。 - 非
speaking_training_teacher角色:不显示“教务”项,也不占位。
文件位置
custom-tab-bar/index.vue:自定义 TabBar 组件。pages.json:tabBar.custom: true,启用自定义 TabBar。
使用说明
- 自定义 TabBar 自动显示在所有 tab 页面底部。
- 点击项使用
uni.switchTab跳转。 - 当前激活项通过
getCurrentPages()获取当前路由。
角色控制
- 数据源:
backend-role-name(登录成功时写入)。 - 逻辑:角色等于
speaking_training_teacher时展示“教务”;否则过滤掉该项。
图标
- 现用原有图标:
/static/tabbar/reception.png/_active.png/static/tabbar/customer.png/_active.png/static/tabbar/team.png/_active.png/static/tabbar/insight.png/_active.png/static/tabbar/list.png/_active.png(教务,仅教务角色可见)/static/tabbar/me.png/_active.png